diff --git a/README.md b/README.md
index f057881c..8e7d558b 100644
--- a/README.md
+++ b/README.md
@@ -44,6 +44,8 @@ LevelAddDetail.vue:创建关卡页面
 ```
 ProjectManage.vue:项目页面
 ProjectAdd.vue:创建项目页面
+TaskPage.vue:任务页面
+TaskAdd.vue:创建任务页面
 TemplateLibrary.vue:模板页面
 
 ```
@@ -68,6 +70,7 @@ ExaminationCenter.vue:考试中心页面
 ```
 ResearchManage.vue:调研管理页面
 ResearchAdd.vue:创建调研页面
+ManagePage:调研管理-管理页面
 
 ```
 
diff --git a/src/assets/images/coursewareManage/asterisk.png b/src/assets/images/coursewareManage/asterisk.png
new file mode 100644
index 00000000..49c7ac99
Binary files /dev/null and b/src/assets/images/coursewareManage/asterisk.png differ
diff --git a/src/assets/images/coursewareManage/close.png b/src/assets/images/coursewareManage/close.png
new file mode 100644
index 00000000..26992042
Binary files /dev/null and b/src/assets/images/coursewareManage/close.png differ
diff --git a/src/assets/images/coursewareManage/down.png b/src/assets/images/coursewareManage/down.png
new file mode 100644
index 00000000..2d4fe598
Binary files /dev/null and b/src/assets/images/coursewareManage/down.png differ
diff --git a/src/assets/images/coursewareManage/enclosure.png b/src/assets/images/coursewareManage/enclosure.png
new file mode 100644
index 00000000..4bdc5097
Binary files /dev/null and b/src/assets/images/coursewareManage/enclosure.png differ
diff --git a/src/assets/images/coursewareManage/export.png b/src/assets/images/coursewareManage/export.png
new file mode 100644
index 00000000..78b8331f
Binary files /dev/null and b/src/assets/images/coursewareManage/export.png differ
diff --git a/src/assets/images/coursewareManage/export1.png b/src/assets/images/coursewareManage/export1.png
new file mode 100644
index 00000000..8f136521
Binary files /dev/null and b/src/assets/images/coursewareManage/export1.png differ
diff --git a/src/assets/images/coursewareManage/gan.png b/src/assets/images/coursewareManage/gan.png
new file mode 100644
index 00000000..f8442bb0
Binary files /dev/null and b/src/assets/images/coursewareManage/gan.png differ
diff --git a/src/assets/images/coursewareManage/givepower.png b/src/assets/images/coursewareManage/givepower.png
new file mode 100644
index 00000000..94eb5488
Binary files /dev/null and b/src/assets/images/coursewareManage/givepower.png differ
diff --git a/src/assets/images/coursewareManage/reset0.png b/src/assets/images/coursewareManage/reset0.png
new file mode 100644
index 00000000..e9f628fa
Binary files /dev/null and b/src/assets/images/coursewareManage/reset0.png differ
diff --git a/src/assets/images/coursewareManage/reset1.png b/src/assets/images/coursewareManage/reset1.png
new file mode 100644
index 00000000..2ad08ea4
Binary files /dev/null and b/src/assets/images/coursewareManage/reset1.png differ
diff --git a/src/assets/images/coursewareManage/scht.png b/src/assets/images/coursewareManage/scht.png
new file mode 100644
index 00000000..e3a32e92
Binary files /dev/null and b/src/assets/images/coursewareManage/scht.png differ
diff --git a/src/assets/images/coursewareManage/stum.png b/src/assets/images/coursewareManage/stum.png
new file mode 100644
index 00000000..06533bc3
Binary files /dev/null and b/src/assets/images/coursewareManage/stum.png differ
diff --git a/src/assets/images/coursewareManage/up.png b/src/assets/images/coursewareManage/up.png
new file mode 100644
index 00000000..1521cb9c
Binary files /dev/null and b/src/assets/images/coursewareManage/up.png differ
diff --git a/src/assets/images/projectadd/delete.png b/src/assets/images/projectadd/delete.png
new file mode 100644
index 00000000..f1578bba
Binary files /dev/null and b/src/assets/images/projectadd/delete.png differ
diff --git a/src/assets/images/projectadd/delete1.png b/src/assets/images/projectadd/delete1.png
new file mode 100644
index 00000000..b51497f3
Binary files /dev/null and b/src/assets/images/projectadd/delete1.png differ
diff --git a/src/assets/images/projectadd/edit.png b/src/assets/images/projectadd/edit.png
new file mode 100644
index 00000000..2e0809a2
Binary files /dev/null and b/src/assets/images/projectadd/edit.png differ
diff --git a/src/assets/images/projectadd/edit1.png b/src/assets/images/projectadd/edit1.png
new file mode 100644
index 00000000..66b9e1a9
Binary files /dev/null and b/src/assets/images/projectadd/edit1.png differ
diff --git a/src/assets/images/projectadd/ending.png b/src/assets/images/projectadd/ending.png
new file mode 100644
index 00000000..bf8d8549
Binary files /dev/null and b/src/assets/images/projectadd/ending.png differ
diff --git a/src/assets/images/projectadd/keep.png b/src/assets/images/projectadd/keep.png
new file mode 100644
index 00000000..98bec4c7
Binary files /dev/null and b/src/assets/images/projectadd/keep.png differ
diff --git a/src/assets/images/projectadd/right.png b/src/assets/images/projectadd/right.png
new file mode 100644
index 00000000..995670c6
Binary files /dev/null and b/src/assets/images/projectadd/right.png differ
diff --git a/src/assets/scss/common.scss b/src/assets/scss/common.scss
index 5386258b..ef0cdae0 100644
--- a/src/assets/scss/common.scss
+++ b/src/assets/scss/common.scss
@@ -210,7 +210,11 @@ display: none;
     overflow-x: scroll;
     display: flex;
     flex-direction: column;
-    
+    height: 100%;
+		.contentMain {
+      flex: 1;
+			overflow-y: scroll;
+		}
    
 	}}
 	//抽屉--------------------------------------------------------
diff --git a/src/views/courselibrary/CoursewareManage.vue b/src/views/courselibrary/CoursewareManage.vue
index a348c831..58fd3297 100644
--- a/src/views/courselibrary/CoursewareManage.vue
+++ b/src/views/courselibrary/CoursewareManage.vue
@@ -79,22 +79,19 @@
     </div>
 
     <!-- 新建选择线上还是面授课弹窗 -->
-    <div
-      class="selectonlineface"
+    <div class="selectonlineface"
       :style="{ display: of_hs ? 'block' : 'none' }"
     >
       <div class="of_header"></div>
       <div class="of_main">
-        <div class="m_header">
+        <div class="ofm_header">
           <div class="add_icon"></div>
           <span>请选择课程类型</span>
-          <div class="add_exit" @click="of_exit">x</div>
+          <div class="close_exit" @click="of_exit"></div>
         </div>
-        <div class="m_body">
-          <div class="b_header">
-            <span style="font-weight: 900; color: red; margin-right: 6px"
-              >⃰</span
-            >
+        <div class="ofm_body">
+          <div class="ofmb_header">
+            <div class="sign"></div>
             <span style="margin-right: 14px">课程名称</span>
             <div class="b_input">
               <a-input
@@ -142,14 +139,16 @@
               >⃰</span
             >
             <span style="margin-right: 14px">授课形式</span>
-            <div class="bc_boxl">
-              <div class="ol_checkbox"><div class="checkbtn"></div></div>
-              <span style="margin: auto 31px auto 5px">线上</span>
-            </div>
-            <div class="bc_boxr" @click="bs_hShow">
-              <div class="ol_checkbox"><div class="checkbtn"></div></div>
-              <span style="margin: auto 31px auto 5px">面授</span>
-            </div>
+              <a-radio-group v-model:value="onftvalue">
+                <div class="bc_box">
+                  <div class="bc_boxl" @click="bs_unhShow">
+                    <div class="ol_checkbox"><a-radio v-model:checked="checked" :value="1">线上</a-radio></div>
+                  </div>
+                  <div class="bc_boxr" @click="bs_hShow">
+                    <div class="ol_checkbox"><a-radio v-model:checked="checked" :value="2">面授</a-radio></div>
+                  </div>
+                </div>
+              </a-radio-group>
           </div>
           <div class="b_sup" :style="{ display: bs_hs ? 'block' : 'none' }">
             <div class="bs_box">
@@ -157,14 +156,12 @@
                 >⃰</span
               >
               <span style="margin-right: 14px">是否设置目录</span>
-              <div class="ol_checkbox">
-                <div class="checkbtn"></div>
-              </div>
-              <span style="margin: auto 45px auto 5px">是</span>
-              <div class="ol_checkbox">
-                <div class="checkbtn"></div>
-              </div>
-              <span style="margin: auto 0px auto 5px">否</span>
+              <a-radio-group v-model:value="value">
+                <div class="bc_box">
+                  <div class="ol_checkbox"><a-radio v-model:checked="checked" :value="1">是</a-radio></div>
+                  <div class="ol_checkbox"><a-radio v-model:checked="checked" :value="2">否</a-radio></div>
+                </div>
+              </a-radio-group>
             </div>
           </div>
           <div class="b_footer">
@@ -187,7 +184,7 @@
         <div class="m_header">
           <div class="add_icon"></div>
           <span>新建面授课</span>
-          <div class="add_exit" @click="ft_exit">x</div>
+          <div class="close_exit" @click="ft_exit" ></div>
         </div>
         <div class="m_title">课程信息</div>
         <div class="m_body">
@@ -211,7 +208,7 @@
                 <div class="i2_right" @click="hideShow">
                   <div
                     class="b_zk"
-                    :style="{ display: hideshow ? 'block' : 'none' }"
+                    :style="{ display: hideshow ?  'block' :'none'  }"
                   >
                     <span style="color: #4ea6ff">收起</span>
                   </div>
@@ -378,7 +375,7 @@
 
     <!-- 表格 -->
     <div class="tableBox">
-      <a-table
+      <!-- <a-table
         :columns="tableDataFunc()"
         :data-source="tableData"
         :loading="tableDataTotal === -1 ? true : false"
@@ -386,6 +383,15 @@
         expandRowByClick="true"
         @expand="expandTable"
         :pagination="false"
+      /> -->
+      <a-table
+        :columns="columns5"
+        :data-source="tableData"
+        :loading="tableDataTotal === -1 ? true : false"
+        :scroll="{ x: 800 }"
+        expandRowByClick="true"
+        @expand="expandTable"
+        :pagination="false"
       />
     </div>
     <!-- 表格 -->
@@ -393,342 +399,322 @@
     <!-- 操作管理在线课程管理页面 -->
     <div class="onlinemanage" :style="{ display: om_1 ? 'block' : 'none' }">
       <div class="om_header"></div>
-      <div class="om_main">
-        <div class="omm_header">
-          <div class="pc_icon"></div>
-          <span>在线课程管理</span>
-          <div class="pc_exit" @click="om_exit">x</div>
+        <div class="om_main">
+            <div class="omm_header">
+                <div class="pc_icon"></div>
+                <span>在线课程管理</span>
+                <div class="close_exit" @click="om_exit"></div>
+            </div>
+            <div class="om_body">
+                <div class="b_title">课程：BMOT2021年职级晋升-安全管理（高级）</div>
+                <div class="b_sub">
+                    <div class="bs_type">类型：</div>
+                    <div class="bs_right">录播课</div>
+                    <div class="bs_left">内容分类：</div>
+                    <div class="bs_right">领导力</div>
+                    <div class="bs_left">状态：</div>
+                    <div class="bs_right">已审核</div>
+                </div>
+                <div class="b_menu">
+                    <a-menu v-model:selectedKeys="current" mode="horizontal">
+                        <a-menu-item key="mail">
+                            报名管理
+                        </a-menu-item>
+                        <a-menu-item key="sub2">
+                            学习记录
+                        </a-menu-item>
+                        <a-menu-item key="sub3">
+                            资源完成情况
+                        </a-menu-item>
+                    </a-menu>
+                </div>
+                <div class="b_menunav">
+                    <div class="bm_select">
+                        <a-select
+                            class="select"
+                            ref="select"
+                            placeholder="请选择状态"
+                            v-model:value="value1"
+                            style="width: 200px;"
+                            @focus="focus"
+                            @change="handleChange"
+                            >
+                            <a-select-option value="status">状态</a-select-option>
+                            <a-select-option value="passed">已通过</a-select-option>
+                            <a-select-option value="weishenhe">未审核</a-select-option>
+                            <a-select-option value="reject">管理员拒绝</a-select-option>
+                        </a-select>
+                    </div>
+                    <div class="bm_input">
+                        <a-input v-model:value="value" style="width: 200px ;height:40px;border-radius: 8px;" placeholder="姓名" />
+                    </div>
+                    <div class="bm_btn">
+                        <div class="btn btn1">
+                            <div class="search"></div>
+                            <div class="btnText">搜索</div>
+                        </div>
+                    </div>
+                </div>
+                <div class="bm_table" style="margin-bottom:20px;">
+                    <a-table
+                        :columns="columns1"
+                        :data-source="tableData2"
+                        :loading="tableDataTotal === -1 ? true : false"
+                        :pagination="false"
+                    />
+                </div>
+            </div>
         </div>
-        <div class="om_body">
-          <div class="b_title">课程：BMOT2021年职级晋升-安全管理（高级）</div>
-          <div class="b_sub">
-            <div class="bs_type">类型：</div>
-            <div class="bs_right">录播课</div>
-            <div class="bs_left">内容分类：</div>
-            <div class="bs_right">领导力</div>
-            <div class="bs_left">状态：</div>
-            <div class="bs_right">已审核</div>
-          </div>
-          <div class="b_menu">
-            <a-menu v-model:selectedKeys="current" mode="horizontal">
-              <a-menu-item key="mail"> 报名管理 </a-menu-item>
-              <a-menu-item key="sub2"> 学习记录 </a-menu-item>
-              <a-menu-item key="sub3"> 资源完成情况 </a-menu-item>
-            </a-menu>
-          </div>
-          <div class="b_menunav">
-            <div class="bm_select">
-              <a-select
-                class="select"
-                ref="select"
-                placeholder="请选择状态"
-                v-model:value="value1"
-                style="width: 200px"
-                @focus="focus"
-                @change="handleChange"
-              >
-                <a-select-option value="status">状态</a-select-option>
-                <a-select-option value="passed">已通过</a-select-option>
-                <a-select-option value="weishenhe">未审核</a-select-option>
-                <a-select-option value="reject">管理员拒绝</a-select-option>
-              </a-select>
-            </div>
-            <div class="bm_input">
-              <a-input
-                v-model:value="value"
-                style="width: 200px; height: 40px; border-radius: 8px"
-                placeholder="姓名"
-              />
-            </div>
-            <div class="bm_btn">
-              <div class="btn btn1">
-                <div class="search"></div>
-                <div class="btnText">搜索</div>
-              </div>
-            </div>
-          </div>
-          <div class="bm_table">
-            <a-table
-              :columns="columns1"
-              :data-source="tableData2"
-              :loading="tableDataTotal === -1 ? true : false"
-              :pagination="false"
-            />
-          </div>
-        </div>
-      </div>
     </div>
     <!-- 操作管理在线课程管理页面 -->
 
     <!-- 操作管理面授课程管理页面 -->
     <div class="faceteachmanage" :style="{ display: ftm_1 ? 'block' : 'none' }">
       <div class="om_header"></div>
-      <div class="om_main">
-        <div class="omm_header">
-          <div class="pc_icon"></div>
-          <span>面授课程管理</span>
-          <div class="pc_exit" @click="ftm_exit">x</div>
+        <div class="om_main">
+            <div class="omm_header">
+                <div class="pc_icon"></div>
+                <span>面授课程管理</span>
+                <div class="close_exit" @click="ftm_exit"></div>
+            </div>
+            <div class="om_body">
+                <div class="b_title">课程：BMOT2021年职级晋升-安全管理（高级）</div>
+                <div class="b_sub">
+                    <div class="bs_type">类型：</div>
+                    <div class="bs_right">录播课</div>
+                    <div class="bs_left">内容分类：</div>
+                    <div class="bs_right">领导力</div>
+                    <div class="bs_left">状态：</div>
+                    <div class="bs_right">已审核</div>
+                </div>
+                <div class="b_menu">
+                    <a-menu v-model:selectedKeys="current" mode="horizontal">
+                        <a-menu-item key="mail">
+                            报名管理
+                        </a-menu-item>
+                        <a-menu-item key="sub2">
+                            学习记录
+                        </a-menu-item>
+                    </a-menu>
+                </div>
+                <div class="b_menunav">
+                    <div class="bm_select">
+                        <a-select
+                            class="select"
+                            ref="select"
+                            placeholder="请选择状态"
+                            v-model:value="value1"
+                            style="width: 200px;"
+                            @focus="focus"
+                            @change="handleChange"
+                            >
+                            <a-select-option value="status">状态</a-select-option>
+                            <a-select-option value="passed">已通过</a-select-option>
+                            <a-select-option value="weishenhe">未审核</a-select-option>
+                            <a-select-option value="reject">管理员拒绝</a-select-option>
+                        </a-select>
+                    </div>
+                    <div class="bm_input">
+                        <a-input v-model:value="value" style="width: 200px ;height:40px;border-radius: 8px;" placeholder="姓名" />
+                    </div>
+                    <div class="bm_btn">
+                        <div class="btn btn1">
+                            <div class="search"></div>
+                            <div class="btnText">搜索</div>
+                        </div>
+                    </div>
+                </div>
+                <div class="bm_table" style="margin-bottom:20px;">
+                    <a-table
+                        :columns="columns1"
+                        :data-source="tableData3"
+                        :loading="tableDataTotal === -1 ? true : false"
+                        :pagination="false"
+                    >
+                      <template #bodyCell="{ column }">
+                        <template v-if="column.key === 'opacation'">
+                          <a @click="ckxq_hs">查看详情</a>
+                        </template>
+                      </template>
+                    </a-table>
+                </div>
+            </div>
         </div>
-        <div class="om_body">
-          <div class="b_title">课程：BMOT2021年职级晋升-安全管理（高级）</div>
-          <div class="b_sub">
-            <div class="bs_type">类型：</div>
-            <div class="bs_right">录播课</div>
-            <div class="bs_left">内容分类：</div>
-            <div class="bs_right">领导力</div>
-            <div class="bs_left">状态：</div>
-            <div class="bs_right">已审核</div>
-          </div>
-          <div class="b_menu">
-            <a-menu v-model:selectedKeys="current" mode="horizontal">
-              <a-menu-item key="mail"> 报名管理 </a-menu-item>
-              <a-menu-item key="sub2"> 学习记录 </a-menu-item>
-            </a-menu>
-          </div>
-          <div class="b_menunav">
-            <div class="bm_select">
-              <a-select
-                class="select"
-                ref="select"
-                placeholder="请选择状态"
-                v-model:value="value1"
-                style="width: 200px"
-                @focus="focus"
-                @change="handleChange"
-              >
-                <a-select-option value="status">状态</a-select-option>
-                <a-select-option value="passed">已通过</a-select-option>
-                <a-select-option value="weishenhe">未审核</a-select-option>
-                <a-select-option value="reject">管理员拒绝</a-select-option>
-              </a-select>
-            </div>
-            <div class="bm_input">
-              <a-input
-                v-model:value="value"
-                style="width: 200px; height: 40px; border-radius: 8px"
-                placeholder="姓名"
-              />
-            </div>
-            <div class="bm_btn">
-              <div class="btn btn1">
-                <div class="search"></div>
-                <div class="btnText">搜索</div>
-              </div>
-            </div>
-          </div>
-          <div class="bm_table">
-            <a-table
-              :columns="columns1"
-              :data-source="tableData3"
-              :loading="tableDataTotal === -1 ? true : false"
-              :pagination="false"
-            >
-              <template #bodyCell="{ column }">
-                <template v-if="column.key === 'opacation'">
-                  <a @click="ckxq_hs">查看详情</a>
-                </template>
-              </template>
-            </a-table>
-          </div>
-        </div>
-      </div>
     </div>
     <!-- 操作管理面授课程管理页面 -->
 
     <!-- 操作管理面授课程管理查看详情页面 -->
     <div class="ftsturecord" :style="{ display: om_ckxq ? 'block' : 'none' }">
       <div class="ftsr_header"></div>
-      <div class="ftsr_main">
-        <div class="m_header">
-          <div class="det_icon"></div>
-          <span>查看详情</span>
-          <div class="det_exit" @click="ftsr_exit">x</div>
+        <div class="ftsr_main">
+            <div class="m_header">
+                <div class="det_icon"></div>
+                <span>查看详情</span>
+                <div class="det_exit" @click="ftsr_exit"></div>
+            </div>
+            <div class="ftsr_table">
+                    <a-table
+                        :columns="columns2"
+                        :data-source="tableData4"
+                        :loading="tableDataTotal === -1 ? true : false"
+                        :pagination="false"
+                    >
+                    </a-table>
+            </div>
+            <div class="ftsr_btn" @click="ftsr_exit">        
+                <div class="btnText">取消</div>
+            </div>
         </div>
-        <div class="ftsr_table">
-          <a-table
-            :columns="columns2"
-            :data-source="tableData4"
-            :loading="tableDataTotal === -1 ? true : false"
-            :pagination="false"
-          >
-          </a-table>
-        </div>
-        <div class="ftsr_btn" @click="ftsr_exit">
-          <div class="btnText">取消</div>
-        </div>
-      </div>
     </div>
     <!-- 面授课程管理查看详情页面 -->
 
     <!-- 操作授权页面 -->
     <div class="givepower" :style="{ display: gpm_hs ? 'block' : 'none' }">
       <div class="gp_header"></div>
-      <div class="gp_main">
-        <div class="gpm_header">
-          <div class="pc_icon"></div>
-          <span>授权</span>
-          <div class="pc_exit" @click="gpm_exit">x</div>
+        <div class="gp_main">
+            <div class="gpm_header">
+                <div class="givepower_icon"></div>
+                <span>授权</span>
+                <div class="close_exit" @click="gpm_exit"></div>
+            </div>
+            <div class="gpm_inputbtn">
+              <a-input
+                v-model:value="value"
+                style="width: 270px; height: 40px; border-radius: 8px; margin-right: 14px;"
+                placeholder="请输入姓名"
+              />
+              <div class="gpm_btn btn1">
+                <div class="search"></div>
+                <div class="btnText">搜索</div>
+              </div>
+              <div class="gpm_btn btn2">
+                <div class="reset"></div>
+                <div class="btnText">重置</div>
+              </div>
+            </div>
+            <div class="gpm_notice">
+              <div class="th_icon"></div>
+              <div class="textarea">已选择 <span style="color: #4EA6FF;">1</span> 项</div>
+              <div class="textarea"><span style="color:#999BA3;">列表选项总计：</span><span>5条</span></div>
+            </div>
+            <div class="gpm_table">
+                <a-table
+                    :columns="columns3"
+                    :data-source="tableData5"
+                    :loading="tableDataTotal === -1 ? true : false"
+                    :pagination="{
+                      showSizeChanger: true,
+                      showQuickJumper: true,
+                      hideOnSinglePage: true,
+                      pageSizeOptions: [],
+                      pageSize: pageSize,
+                      current: currentPage,
+                      total: tableDataTotal,
+                      onChange: (page, pageSize) => {
+                        currentPage = page;
+                        // console.log('page', page)
+                        // 加翻页查找代码
+                        // 	this.setState({
+                        // 		currentPage: page,
+                        // 	}, () => {
+                        // 		this.getMilitaryDeployment()
+                        // 	})
+                      },
+                    }"
+                >
+                  <template #bodyCell="{ column }">
+                    <template v-if="column.key === 'opacation'">
+                      <a>取消授权</a>
+                    </template>
+                  </template>
+                </a-table>
+            </div>
         </div>
-        <div class="gpm_inputbtn">
-          <a-input
-            v-model:value="value"
-            style="
-              width: 270px;
-              height: 40px;
-              border-radius: 8px;
-              margin-right: 14px;
-            "
-            placeholder="请输入项目名称"
-          />
-          <div class="gpm_btn btn1">
-            <div class="search"></div>
-            <div class="btnText">搜索</div>
-          </div>
-          <div class="gpm_btn btn2">
-            <div class="search"></div>
-            <div class="btnText">重置</div>
-          </div>
-        </div>
-        <div class="gpm_notice">
-          <div class="th_icon"><div class="th_text">i</div></div>
-          <div class="textarea">
-            已选择 <span style="color: #4ea6ff">1</span> 项
-          </div>
-          <div class="textarea">
-            <span style="color: #999ba3">列表选项总计：</span><span>5条</span>
-          </div>
-        </div>
-        <div class="gpm_table">
-          <a-table
-            :columns="columns3"
-            :data-source="tableData5"
-            :loading="tableDataTotal === -1 ? true : false"
-            :pagination="{
-              showSizeChanger: true,
-              showQuickJumper: true,
-              hideOnSinglePage: true,
-              pageSizeOptions: [],
-              pageSize: pageSize,
-              current: currentPage,
-              total: tableDataTotal,
-              onChange: (page, pageSize) => {
-                currentPage = page;
-                // console.log('page', page)
-                // 加翻页查找代码
-                // 	this.setState({
-                // 		currentPage: page,
-                // 	}, () => {
-                // 		this.getMilitaryDeployment()
-                // 	})
-              },
-            }"
-          >
-            <template #bodyCell="{ column }">
-              <template v-if="column.key === 'opacation'">
-                <a @click="ckxq_hs">取消授权</a>
-              </template>
-            </template>
-          </a-table>
-        </div>
-      </div>
     </div>
     <!--操作授权页面 -->
 
     <!--开课页面 -->
     <div class="schooltime" :style="{ display: stm_hs ? 'block' : 'none' }">
       <div class="st_header"></div>
-      <div class="st_main">
-        <div class="stm_header">
-          <div class="pc_icon"></div>
-          <span>开课</span>
-          <div class="pc_exit" @click="stm_exit">x</div>
+        <div class="st_main">
+            <div class="stm_header">
+                <div class="scht_icon"></div>
+                <span>开课</span>
+                <div class="close_exit" @click="stm_exit"></div>
+            </div>
+            <div class="stm_inputbtn">
+              <a-input
+                v-model:value="value"
+                style="width: 270px; height: 40px; border-radius: 8px; margin-right: 14px;"
+                placeholder="请输入创建人"
+              />
+              <a-input
+                v-model:value="value"
+                style="width: 270px; height: 40px; border-radius: 8px; margin-right: 14px;"
+                placeholder="请输入教师名称"
+              />
+              <div class="select">
+                <a-date-picker
+                  v-model="selectTime"
+                  type="date"
+                  placeholder="创建时间"
+                  style="width: 270px; margin-right: 14px;"
+                />
+              </div>
+              <div class="stm_btn btn1">
+                <div class="search"></div>
+                <div class="btnText">搜索</div>
+              </div>
+              <div class="stm_btn btn2">
+                <div class="reset"></div>
+                <div class="btnText">重置</div>
+              </div>
+              <div class="stm_btn3 btn3" >
+                <div class="add"></div>
+                <div class="btnText" @click="createkk"><span style="color:#ffffff;">新建开课</span> </div>
+              </div>
+            </div>
+            <div class="stm_table">
+              <a-table
+                :columns="columns4"
+                :data-source="tableData6"
+                :loading="tableDataTotal === -1 ? true : false"
+                :scroll="{ x: 700, y: 800 }"
+                expandRowByClick="true"
+                @expand="expandTable"
+                :pagination="{
+                  showSizeChanger: true,
+                  showQuickJumper: true,
+                  hideOnSinglePage: true,
+                  pageSizeOptions: [],
+                  pageSize: pageSize,
+                  current: currentPage,
+                  total: tableDataTotal,
+                  onChange: (page, pageSize) => {
+                    currentPage = page;
+                    // console.log('page', page)
+                    // 加翻页查找代码
+                    // 	this.setState({
+                    // 		currentPage: page,
+                    // 	}, () => {
+                    // 		this.getMilitaryDeployment()
+                    // 	})
+                  },
+                }"
+              />
+            </div>
         </div>
-        <div class="stm_inputbtn">
-          <a-input
-            v-model:value="value"
-            style="
-              width: 270px;
-              height: 40px;
-              border-radius: 8px;
-              margin-right: 14px;
-            "
-            placeholder="请输入创建人"
-          />
-          <a-input
-            v-model:value="value"
-            style="
-              width: 270px;
-              height: 40px;
-              border-radius: 8px;
-              margin-right: 14px;
-            "
-            placeholder="请输入教师名称"
-          />
-          <div class="select">
-            <a-date-picker
-              v-model="selectTime"
-              type="date"
-              placeholder="创建时间"
-              style="width: 270px; margin-right: 14px"
-            />
-          </div>
-          <div class="stm_btn btn1">
-            <div class="search"></div>
-            <div class="btnText">搜索</div>
-          </div>
-          <div class="stm_btn btn2">
-            <div class="search"></div>
-            <div class="btnText">重置</div>
-          </div>
-          <div class="stm_btn btn3" style="width: 130px">
-            <div class="search"></div>
-            <div class="btnText" @click="createkk">新建开课</div>
-          </div>
-        </div>
-        <div class="stm_table">
-          <a-table
-            :columns="columns4"
-            :data-source="tableData6"
-            :loading="tableDataTotal === -1 ? true : false"
-            :scroll="{ x: 700, y: 800 }"
-            expandRowByClick="true"
-            @expand="expandTable"
-            :pagination="{
-              showSizeChanger: true,
-              showQuickJumper: true,
-              hideOnSinglePage: true,
-              pageSizeOptions: [],
-              pageSize: pageSize,
-              current: currentPage,
-              total: tableDataTotal,
-              onChange: (page, pageSize) => {
-                currentPage = page;
-                // console.log('page', page)
-                // 加翻页查找代码
-                // 	this.setState({
-                // 		currentPage: page,
-                // 	}, () => {
-                // 		this.getMilitaryDeployment()
-                // 	})
-              },
-            }"
-          />
-        </div>
-      </div>
     </div>
     <!--开课页面 -->
 
     <!--新建开课页面 -->
-    <div
-      class="createschooltime"
-      :style="{ display: cstm_hs ? 'block' : 'none' }"
-    >
+    <div class="createschooltime" :style="{ display: cstm_hs ? 'block' : 'none' }">
       <div class="cst_header"></div>
       <div class="cst_main">
         <div class="cstm_header">
           <div class="add_icon"></div>
           <span>新建开课</span>
-          <div class="add_exit" @click="cstm_exit">x</div>
+          <div class="close_exit" @click="cstm_exit"></div>
         </div>
         <div class="cstm_title"><span>面授名称：管理者的专属面授课</span></div>
         <div class="cstm_items items1">
@@ -847,6 +833,105 @@
       </div>
     </div>
     <!--新建开课页面 -->
+
+    <!--新建开课学员管理页面页面 -->
+    <div class="studentsmanage"
+    :style="{ display: sm_hs ? 'block' : 'none' }">
+        <div class="stm_header">
+        </div>
+        <div class="stm_main">
+            <div class="stmm_header">
+                <div class="stum_icon"></div>
+                <span>学员管理</span>
+                <div class="close_exit" @click="sm_exit"></div>
+            </div>
+            <div class="stmmitems">
+              <div class="stmm_i1"><span style="margin-right:52px;">XXX课程-第1期-20220726</span><span style="color:#FFB751;">已开课    4.5</span></div>
+              <div class="stmm_i2"><span style="color:#999BA3;">时间：</span><span>2022-07-26 14：30-15：00</span></div>
+              <div class="stmm_i3"><span style="color:#999BA3;">地点：</span><span>核心能力大楼培训教室</span></div>
+              <div class="stmm_i4"><span style="color:#999BA3;">授课教师：</span><span>王雪han</span></div>
+              <div class="stmm_i5">
+                <div class="i5_left">
+                  <a-input
+                    v-model:value="value"
+                    style="width: 270px; height: 40px; border-radius: 8px; margin-right: 14px;"
+                    placeholder="请输入姓名"
+                  />
+                  <div class="stmm_btn btn1">
+                    <div class="search"></div>
+                    <div class="btnText">搜索</div>
+                  </div>
+                  <div class="stmm_btn btn2">
+                    <div class="reset"></div>
+                    <div class="btnText">重置</div>
+                  </div>
+                </div>
+                <div class="i5_right">
+                  <div class="stmm_btn btn3">
+                    <span style="color: #ffffff;">添加学员</span> 
+                  </div>
+                  <div class="stmm_btn btn4" @click="hideShow">
+                    <div class="btn4_sub">
+                      <span style="color:#4EA6FF;margin-right:4px;">批量操作</span>
+                      <div
+                        class="b_zk"
+                        :style="{ display: hideshow ?  'block' :'none'  }"
+                      >
+                      </div>
+                      <div
+                        class="b_sq"
+                        :style="{ display: hideshow ? 'none' : 'block' }"
+                      >
+                      </div>
+                    </div>
+                    <div class="btn4_sup"
+                    :style="{ display: hideshow ? 'none' : 'block' }">
+                      <div class="btn4_tit"><span style="color:#4EA6FF;">批量录入成绩</span></div>
+                      <div class="btn4_op1"><span style="margin:10px auto">批量结业</span></div>
+                      <div class="btn4_op2"><span style="margin:10px auto">批量通过</span></div>
+                      <div class="btn4_op3"><span style="margin:10px auto">批量拒绝</span></div>                      
+                    </div>
+                  </div>
+                  <div class="stmm_btn btn5">
+                    <div class="export"></div>
+                    <div class="btnText">导出</div>
+                  </div>
+
+                </div>
+              </div>
+              <div class="stmm_i6">
+                <a-table
+                  :columns="columns6"
+                  :data-source="tableData7"
+                  :loading="tableDataTotal === -1 ? true : false"
+                  :scroll="{ x: 800 }"
+                  expandRowByClick="true"
+                  @expand="expandTable"
+                  :pagination="{
+                    showSizeChanger: true,
+                    showQuickJumper: true,
+                    hideOnSinglePage: true,
+                    pageSizeOptions: [],
+                    pageSize: pageSize,
+                    current: currentPage,
+                    total: tableDataTotal,
+                    onChange: (page, pageSize) => {
+                      currentPage = page;
+                      // console.log('page', page)
+                      // 加翻页查找代码
+                      // 	this.setState({
+                      // 		currentPage: page,
+                      // 	}, () => {
+                      // 		this.getMilitaryDeployment()
+                      // 	})
+                    },
+                  }"
+                />
+              </div>
+            </div>
+        </div>
+    </div>
+    <!--新建开课学员管理页面页面 -->
   </div>
 </template>
 <script>
@@ -1022,6 +1107,170 @@ const columns4 = [
     },
   },
 ];
+const columns5 = [
+        {
+        title: '序号',
+        width: 200,
+        dataIndex: 'num',
+        key: 'num',
+        align: "center",
+      }, {
+        title: '名称',
+        width: 200,
+        dataIndex: 'name',
+        key: 'name',
+      }, {
+        title: '内容分类',
+        width: 200,
+        dataIndex: 'content',
+        key: '1',
+        align: "center",
+      }, {
+        title: '课程形式',
+        width: 200,
+        dataIndex: 'courseform',
+        key: '2',
+        align: "center",
+      }, {
+        title: ' 所属项目',
+        width: 300,
+        dataIndex: 'project',
+        key: '3',
+        align: "center",
+      }, {
+        title: '学习人数',
+        width: 200,
+        dataIndex: 'stunum',
+        key: '4',
+        align: "center",
+      }, {
+        title: '评分',
+        width: 200,
+        dataIndex: 'grade',
+        key: '5',
+        align: "center",
+      }, {
+        title: '状态',
+        width: 200,
+        dataIndex: 'status',
+        key: '6',
+        align: "center",
+      }, {
+        title: '是否发布',
+        width: 200,
+        dataIndex: 'ynpub',
+        key: '7',
+        align: "center",
+      }, {
+        title: '创建人',
+        width: 200,
+        dataIndex: 'creator',
+        key: '8',
+        align: "center",
+      }, {
+        title: '创建时间',
+        width: 280,
+        dataIndex: 'createtime',
+        key: '9',
+        align: "center",
+      }, {
+        title: '上线时间',
+        width: 280,
+        dataIndex: 'pubtime',
+        key: '10',
+        align: "center",
+      }, {
+        title: '是否停用',
+        width: 200,
+        key: 'either',
+        dataIndex: 'ynuse',
+        align: "center",
+      }, {
+        title: '操作',
+        width: 400,
+        className: "h",
+        dataIndex: "operation",
+        key: 'operation',
+        fixed: 'right',
+        align: "center",
+        },
+];
+const columns6 = [
+        {
+        title: '序号',
+        width: 200,
+        dataIndex: 'num',
+        key: 'num',
+        align: "center",
+      }, {
+        title: '姓名',
+        width: 200,
+        dataIndex: 'name',
+        key: 'name',
+      }, {
+        title: '工号',
+        width: 200,
+        dataIndex: 'number',
+        key: '1',
+        align: "center",
+      }, {
+        title: '部门',
+        width: 200,
+        dataIndex: 'department',
+        key: '2',
+        align: "center",
+      }, {
+        title: ' 岗位',
+        width: 300,
+        dataIndex: 'postion',
+        key: '3',
+        align: "center",
+      }, {
+        title: 'Band',
+        width: 200,
+        dataIndex: 'band',
+        key: '4',
+        align: "center",
+      }, {
+        title: '报名状态',
+        width: 200,
+        dataIndex: 'status',
+        key: '5',
+        align: "center",
+      }, {
+        title: '加入方式',
+        width: 200,
+        dataIndex: 'join',
+        key: '6',
+        align: "center",
+      }, {
+        title: '签到状态',
+        width: 200,
+        dataIndex: 'signstatus',
+        key: '7',
+        align: "center",
+      }, {
+        title: '评估状态',
+        width: 200,
+        dataIndex: 'evastatus',
+        key: '8',
+        align: "center",
+      }, {
+        title: '结业状态',
+        width: 280,
+        dataIndex: 'overstatus',
+        key: '9',
+        align: "center",
+      },{
+        title: '操作',
+        width: 400,
+        className: "h",
+        dataIndex: "operation",
+        key: 'operation',
+        fixed: 'right',
+        align: "center",
+        },
+];
 export default defineComponent({
   components: {
     LoadingOutlined,
@@ -1208,9 +1457,6 @@ export default defineComponent({
           authority: "管理权",
         },
       ],
-      currentPage: 1,
-      tableDataTotal: 50,
-      pageSize: 5,
       tableData6: [
         {
           key: 1,
@@ -1253,185 +1499,211 @@ export default defineComponent({
           createtime: "2022-07-14 14:00:00",
         },
       ],
-    });
-    const tableDataFunc = () => {
-      const columns = [
+      tableData7: [
         {
-          title: "序号",
-          width: 200,
-          dataIndex: "num",
-          key: "num",
-          align: "center",
-        },
-        {
-          title: "名称",
-          width: 200,
-          dataIndex: "name",
-          key: "name",
-        },
-        {
-          title: "内容分类",
-          width: 200,
-          dataIndex: "content",
           key: "1",
-          align: "center",
+          num: 1,
+          name: "李梦",
+          number: "1000",
+          department: "显示事业",
+          postion: "产品经理",
+          band: "Band9",
+          status: "待审核",
+          join: "手动加入",
+          signstatus: "-",
+          evastatus: "-",
+          overstatus: "-",
+          operation: "2022-07-20 9:30",
         },
         {
-          title: "课程形式",
-          width: 200,
-          dataIndex: "courseform",
           key: "2",
-          align: "center",
+          num: 2,
+          name: "李梦",
+          number: "1001",
+          department: "智慧医工",
+          postion: "产品经理",
+          band: "Band10",
+          status: "已通过",
+          join: "手动加入",
+          signstatus: "已签到",
+          evastatus: "已评估",
+          overstatus: "-",
+          operation: "2022-07-20 9:30",
         },
         {
-          title: " 所属项目",
-          width: 300,
-          dataIndex: "project",
           key: "3",
-          align: "center",
+          num: 3,
+          name: "李梦",
+          number: "1002",
+          department: "业务支援",
+          postion: "产品经理",
+          band: "Band10",
+          status: "已拒绝",
+          join: "手动加入",
+          signstatus: "-",
+          evastatus: "-",
+          overstatus: "-",
+          operation: "2022-07-20 9:30",
         },
         {
-          title: "学习人数",
-          width: 200,
-          dataIndex: "stunum",
           key: "4",
-          align: "center",
+          num: 4,
+          name: "李梦",
+          number: "1003",
+          department: "业务支援",
+          postion: "产品经理",
+          band: "Band9",
+          status: "已通过",
+          join: "报名加入",
+          signstatus: "已签到",
+          evastatus: "-",
+          overstatus: "90/已结业",
+          operation: "2022-07-20 9:30",
         },
         {
-          title: "评分",
-          width: 200,
-          dataIndex: "grade",
           key: "5",
-          align: "center",
+          num: 5,
+          name: "李梦",
+          number: "1004",
+          department: "业务支援",
+          postion: "产品经理",
+          band: "Band9",
+          status: "已通过",
+          join: "报名加入",
+          signstatus: "请假",
+          evastatus: "-",
+          overstatus: "",
+          operation: "2022-07-20 9:30",
         },
-        {
-          title: "状态",
-          width: 200,
-          dataIndex: "status",
-          key: "6",
-          align: "center",
-        },
-        {
-          title: "是否发布",
-          width: 200,
-          dataIndex: "ynpub",
-          key: "7",
-          align: "center",
-        },
-        {
-          title: "创建人",
-          width: 200,
-          dataIndex: "creator",
-          key: "8",
-          align: "center",
-        },
-        {
-          title: "创建时间",
-          width: 280,
-          dataIndex: "createtime",
-          key: "9",
-          align: "center",
-        },
-        {
-          title: "上线时间",
-          width: 280,
-          dataIndex: "pubtime",
-          key: "10",
-          align: "center",
-        },
-        {
-          title: "是否停用",
-          width: 200,
-          key: "either",
-          dataIndex: "ynuse",
-          align: "center",
-        },
-        {
-          title: "操作",
-          width: 400,
-          className: "h",
-          dataIndex: "opacation",
-          key: "operation",
-          fixed: "right",
-          align: "center",
-          scopedSlots: { customRender: "action" },
-          customRender: (text) => {
-            // console.log('111',text);
-            return (
-              <div class="op_box">
-                <div class="opacation">
-                  <span
-                    class={
-                      text.record.courseform === "面授"
-                        ? "activecls"
-                        : "errorCls"
-                    }
-                    style={{ "margin-left": "25px" }}
-                  >
-                    开课
-                  </span>
-                  <span
-                    class={
-                      text.record.ynuse === "停用" ? "activecls" : "errorCls"
-                    }
-                    style={{ "margin-left": "25px" }}
-                  >
-                    停用
-                  </span>
-                  <span
-                    class={
-                      text.record.status === "未提交" ||
-                      text.record.status === "审核未通过"
-                        ? "activecls"
-                        : "errorCls"
-                    }
-                    style={{ "margin-left": "25px" }}
-                  >
-                    编辑
-                  </span>
-                  <span
-                    onClick={() => {}}
-                    class={
-                      text.record.status === "已审核" ? "activecls" : "errorCls"
-                    }
-                    style={{ "margin-left": "25px" }}
-                  >
-                    管理
-                  </span>
-                  <span
-                    class={
-                      text.record.status === "待审核" ? "errorCls" : "activecls"
-                    }
-                    style={{ "margin-left": "25px" }}
-                  >
-                    复制
-                  </span>
-                  <span style={{ "margin-left": "25px" }} class="more">
-                    <span>授权</span>
-                    <div class="moreArrow"></div>
-                    <div class="moreItems">
-                      <span style="color:#4EA6FF;">权限名单</span>
-                      <div class="mitems1">归属权</div>
-                      <div class="mitems2">管理权</div>
-                      <div class="mitems3">查看权</div>
-                    </div>
-                  </span>
-                  <span
-                    style={{ "margin-left": "21px", "margin-right": "30px" }}
-                    class="more"
-                  >
-                    <span>更多</span>
-                    <div class="moreArrow"></div>
-                    <div class="moreItems"></div>
-                  </span>
-                </div>
-              </div>
-            );
-          },
-        },
-      ];
-      return columns;
-    };
+      ],
+      currentPage: 1,
+      tableDataTotal: 100,
+      pageSize: 10,
+    });
+    // const tableDataFunc = () => {
+    //   const columns = [
+    //     {
+    //     title: '序号',
+    //     width: 200,
+    //     dataIndex: 'num',
+    //     key: 'num',
+    //     align: "center",
+    //   }, {
+    //     title: '名称',
+    //     width: 200,
+    //     dataIndex: 'name',
+    //     key: 'name',
+    //   }, {
+    //     title: '内容分类',
+    //     width: 200,
+    //     dataIndex: 'content',
+    //     key: '1',
+    //     align: "center",
+    //   }, {
+    //     title: '课程形式',
+    //     width: 200,
+    //     dataIndex: 'courseform',
+    //     key: '2',
+    //     align: "center",
+    //   }, {
+    //     title: ' 所属项目',
+    //     width: 300,
+    //     dataIndex: 'project',
+    //     key: '3',
+    //     align: "center",
+    //   }, {
+    //     title: '学习人数',
+    //     width: 200,
+    //     dataIndex: 'stunum',
+    //     key: '4',
+    //     align: "center",
+    //   }, {
+    //     title: '评分',
+    //     width: 200,
+    //     dataIndex: 'grade',
+    //     key: '5',
+    //     align: "center",
+    //   }, {
+    //     title: '状态',
+    //     width: 200,
+    //     dataIndex: 'status',
+    //     key: '6',
+    //     align: "center",
+    //   }, {
+    //     title: '是否发布',
+    //     width: 200,
+    //     dataIndex: 'ynpub',
+    //     key: '7',
+    //     align: "center",
+    //   }, {
+    //     title: '创建人',
+    //     width: 200,
+    //     dataIndex: 'creator',
+    //     key: '8',
+    //     align: "center",
+    //   }, {
+    //     title: '创建时间',
+    //     width: 280,
+    //     dataIndex: 'createtime',
+    //     key: '9',
+    //     align: "center",
+    //   }, {
+    //     title: '上线时间',
+    //     width: 280,
+    //     dataIndex: 'pubtime',
+    //     key: '10',
+    //     align: "center",
+    //   }, {
+    //     title: '是否停用',
+    //     width: 200,
+    //     key: 'either',
+    //     dataIndex: 'ynuse',
+    //     align: "center",
+    //   }, {
+    //     title: '操作',
+    //     width: 400,
+    //     className: "h",
+    //     dataIndex: "opacation",
+    //     key: 'operation',
+    //     fixed: 'right',
+    //     align: "center",
+    //     scopedSlots: { customRender: "action" }, 
+    //     customRender: (text) => {
+    //       // console.log('111',text);
+    //         return (
+    //           <div class="op_box">
+    //             <div class="opacation">
+    //               <span class={text.record.courseform === '面授' ? "activecls" : "errorCls"} style={{ "margin-left": "25px" }} >开课</span>
+    //               <span class={text.record.ynuse === '停用' ? "activecls" : "errorCls"} style={{ "margin-left": "25px" }} >停用</span>
+    //               <span class={text.record.status === '未提交' || text.record.status === '审核未通过' ? "activecls" : "errorCls"} style={{ "margin-left": "25px" }} >编辑</span>
+    //               <span onClick={() => {}} class={text.record.status === '已审核' ? "activecls" : "errorCls"} style={{ "margin-left": "25px" }} >管理</span>
+    //               <span class={text.record.status === '待审核' ?  "errorCls" : "activecls"} style={{ "margin-left": "25px" }} >复制</span>
+    //               <span style={{ "margin-left": "25px" }} class="more">
+    //                 <span>授权</span>
+    //                 <div class="moreArrow"></div>
+    //                 <div class="moreItems">
+    //                   <span style="color:#4EA6FF;">权限名单</span>
+    //                   <div class="mitems1">归属权</div>
+    //                   <div class="mitems2">管理权</div>
+    //                   <div class="mitems3">查看权</div>
+    //                 </div>
+    //               </span>
+    //               <span
+    //                 style={{ "margin-left": "21px", "margin-right": "30px" }}
+    //                 class="more"
+    //               >
+    //                 <span>更多</span>
+    //                 <div class="moreArrow"></div>
+    //                 <div class="moreItems"></div>
+    //               </span>
+    //             </div>
+    //           </div>
+    //           );
+    //       },
+    //     },
+    //   ];
+    //   return columns;
+    // };
 
     const fileList = ref([]);
     const loading = ref(false);
@@ -1474,7 +1746,270 @@ export default defineComponent({
       return isJpgOrPng && isLt2M;
     };
 
+    const getTableDate = () => {
+      let data = state.tableData;
+      data.map((value) => {
+        {
+          //单层项目
+          value.operation = (
+            <div class="operation">
+              <div class="nSelect">
+                {value.status === "已审核" ? (
+                  <div class="nselect">
+                    
+                    <div class='ops1'>
+                      <div class="jc">开课</div>
+                    </div>
+
+                    <div class='ops2'>    
+                      <div class="jc">管理</div>
+                    </div>
+
+                    <div class='ops3'>                   
+                      <div class="jc">复制</div>
+                    </div>
+
+                    <div class="tableSelect">
+                      <div class='ops4'> 
+                        <a-select
+                          style="width: 50px;margin-top:2px;margin-left:25px"
+                          value="授权"
+                          // options={state.projectNameList}
+                          dropdownClassName="tabledropdown"
+                        >
+                          <a-select-option value="权限名单" label="权限名单">
+                            <div>权限名单</div>
+                          </a-select-option>
+                          <a-select-option value="归属权" label="归属权">
+                            <div
+                              onClick={() => {
+                                console.log("点击了");
+                              }}
+                            >
+                              归属权
+                            </div>
+                          </a-select-option>
+                          <a-select-option value="查看权" label="查看权">
+                            <div>查看权</div>
+                          </a-select-option>
+                          <a-select-option value="管理权" label="管理权">
+                            <div>管理权</div>
+                          </a-select-option>
+                        </a-select>
+                      </div>
+                    </div>
+                    <div class="tableSelect">
+                      <div class='ops5'> 
+                        <a-select
+                          style="width: 50px;margin-top:2px;margin-left:25px"
+                          value="更多"
+                          // options={state.projectNameList}
+                          dropdownClassName="tabledropdown"
+                        >
+                          <a-select-option
+                            value="复制"
+                            label="复制"
+                            style="padding-left:35px"
+                          >
+                            <div>复制</div>
+                          </a-select-option>
+                          <a-select-option
+                            value="取消"
+                            label="取消"
+                            style="padding-left:35px"
+                          >
+                            <div
+                              onClick={() => {
+                                console.log("点击了");
+                              }}
+                            >
+                              取消
+                            </div>
+                          </a-select-option>
+                        </a-select>
+                      </div>
+                    </div>
+                  </div>
+                ) : (
+                  <div></div>
+                )}
+                {value.status === "待审核" ? (
+                  <div class="nselect">
+
+                    <div class='ops1'>
+                      <div class="jc">开课</div>
+                    </div>
+
+                    <div class='ops5'> 
+                      <div class="jc">撤回</div>
+                    </div>
+
+                    <div class="tableSelect">
+                      <div class='ops4'> 
+                        <a-select
+                          style="width: 50px;margin-top:2px;margin-left:25px"
+                          value="授权"
+                          // options={state.projectNameList}
+                          dropdownClassName="tabledropdown"
+                        >
+                          <a-select-option value="权限名单" label="权限名单">
+                            <div>权限名单</div>
+                          </a-select-option>
+                          <a-select-option value="归属权" label="归属权">
+                            <div
+                              onClick={() => {
+                                console.log("点击了");
+                              }}
+                            >
+                              归属权
+                            </div>
+                          </a-select-option>
+                          <a-select-option value="查看权" label="查看权">
+                            <div>查看权</div>
+                          </a-select-option>
+                          <a-select-option value="管理权" label="管理权">
+                            <div>管理权</div>
+                          </a-select-option>
+                        </a-select>
+                      </div>
+                    </div>
+                  </div>
+                ) : (
+                  <div></div>
+                )}
+                {value.status === "未提交" ? (
+                  <div class="nselect">
+
+                    <div class='ops1'>
+                      <div class="jc">开课</div>
+                    </div>
+
+                    <div class='ops2'>
+                      <div class="jc">编辑</div>
+                    </div>
+
+                    <div class='ops3'>                   
+                      <div class="jc">复制</div>
+                    </div>
+                  </div>
+                ) : (
+                  <div></div>
+                )}
+                {value.status === "审核未通过" ? (
+                  <div class="nselect">
+                    <div class='ops1'>
+                      <div class="jc">开课</div>
+                    </div>
+
+                    <div class='ops2'>
+                      <div class="jc">编辑</div>
+                    </div>
+
+                    <div class='ops3'>                   
+                      <div class="jc">复制</div>
+                    </div>
+
+
+                    <div class="tableSelect">
+                      <div class='ops4'>  
+                        <a-select
+                          style="width: 50px;margin-top:2px;margin-left:25px"
+                          value="授权"
+                          // options={state.projectNameList}
+                          dropdownClassName="tabledropdown"
+                        >
+                          <a-select-option value="权限名单" label="权限名单">
+                            <div>权限名单</div>
+                          </a-select-option>
+                          <a-select-option value="归属权" label="归属权">
+                            <div
+                              onClick={() => {
+                                console.log("点击了");
+                              }}
+                            >
+                              归属权
+                            </div>
+                          </a-select-option>
+                          <a-select-option value="查看权" label="查看权">
+                            <div>查看权</div>
+                          </a-select-option>
+                          <a-select-option value="管理权" label="管理权">
+                            <div>管理权</div>
+                          </a-select-option>
+                        </a-select>
+                      </div>
+                    </div>
+
+                    <div class='ops5'>      
+                      <div class="jc">删除</div>
+                    </div>
+                  </div>
+                ) : (
+                  <div></div>
+                )}
+              </div>
+            </div>
+          );
+        }
+      });
+      state.tableData = data;
+    };
+    getTableDate();
+
+    const getTableDate2 = () => {
+      let data2 = state.tableData7;
+      data2.map((value) => {
+        {
+          //单层项目
+          value.operation = (
+            <div class="operation">
+              <div class="nSelect">
+                {value.status === "待审核" ? (
+                  <div class="nselect">
+                    <div class='ops1'>
+                      <div class="jc">通过</div>
+                    </div>
+                    <div class='ops1'>
+                      <div class="jc">拒绝</div>
+                    </div>
+                    <div class='ops2'>    
+                      <div class="jc">删除</div>
+                    </div>
+                  </div>
+                ) : (
+                  <div></div>
+                )}
+                {value.status === "已通过" ? (
+                  <div class="nselect">
+                    <div class='ops2'>
+                      <div class="jc">删除</div>
+                    </div>
+                  </div>
+                ) : (
+                  <div></div>
+                )}
+                {value.status === "已拒绝" ? (
+                  <div class="nselect">
+                    <div class='ops2'>
+                      <div class="jc">删除</div>
+                    </div>
+                  </div>
+                ) : (
+                  <div></div>
+                )}
+              </div>
+            </div>
+          );
+        }
+      });
+      state.tableData2 = data2;
+    };
+    getTableDate2();
+
+    const onftvalue = ref();
+
     return {
+      onftvalue,
       current,
       ...toRefs(state),
       fileList,
@@ -1484,9 +2019,13 @@ export default defineComponent({
       columns2,
       columns3,
       columns4,
-      tableDataFunc,
+      columns5,
+      columns6,
+      // tableDataFunc,
       handleChange,
       beforeUpload,
+      getTableDate,
+      getTableDate2,
     };
   },
 
@@ -1535,15 +2074,16 @@ export default defineComponent({
 
     const state = reactive({
       of_hs: false,
-      hideshow: false,
-      bs_hs: false,
-      ft_hs: false,
+      hideshow: true,
+      bs_hs: true,
+      ft_hs:false,
       om_1: false,
-      ftm_1: false,
+      ftm_1:false,
       om_ckxq: false,
-      gpm_hs: false,
+      gpm_hs:false,
       stm_hs: false,
-      cstm_hs: false,
+      cstm_hs:false,
+      sm_hs:false,
     });
 
     const of_hShow = () => {
@@ -1555,21 +2095,20 @@ export default defineComponent({
       state.of_hs = false;
     };
     const hideShow = () => {
-      if (state.hideshow == false) {
-        state.hideshow = true;
-      } else {
+      if (state.hideshow == true) {
         state.hideshow = false;
+      } else {
+        state.hideshow = true;
       }
     };
     const bs_hShow = () => {
-      if (state.bs_hs == true) {
-        state.bs_hs = false;
-      } else {
         state.bs_hs = true;
-      }
+    };
+    const bs_unhShow = () => {
+        state.bs_hs = false;
     };
     const createft = () => {
-      if (state.bs_hs == false) {
+      if (state.bs_hs == true) {
         state.of_hs = false;
         state.ft_hs = true;
       }
@@ -1603,6 +2142,9 @@ export default defineComponent({
     const cstm_exit = () => {
       state.cstm_hs = false;
     };
+    const sm_exit = () => {
+      state.sm_hs = false;
+    };
 
     return {
       ...toRefs(state),
@@ -1612,6 +2154,7 @@ export default defineComponent({
       of_exit,
       hideShow,
       bs_hShow,
+      bs_unhShow,
       createft,
       ft_exit,
       om_exit,
@@ -1622,6 +2165,7 @@ export default defineComponent({
       stm_exit,
       createkk,
       cstm_exit,
+      sm_exit,
     };
   },
 });
@@ -1637,17 +2181,15 @@ export default defineComponent({
 // }
 .courseManage {
   width: 100%;
-  min-width: 1000px;
   height: 100%;
   display: flex;
   flex-direction: column;
+  position: relative;
   .headerf {
-    display: flex;
-    margin-left: 38px;
-    margin-top: 30px;
     .filter {
-      width: calc(70% - 40px);
-      margin-right: 30px;
+      margin-left: 38px;
+      margin-right: 38px;
+      margin-top: 30px;
       display: flex;
       justify-content: space-between;
       flex-wrap: wrap;
@@ -1663,6 +2205,7 @@ export default defineComponent({
     .btns {
       display: flex;
       // flex-wrap: wrap;
+      margin-left: 38px;
       .btn {
         padding: 0px 26px 0px 26px;
         height: 38px;
@@ -1756,7 +2299,7 @@ export default defineComponent({
   .selectonlineface {
     z-index: 999;
     width: 679px;
-    height: 525px;
+    // height: 525px;
     background: #ffffff;
     box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
     position: absolute;
@@ -1775,7 +2318,7 @@ export default defineComponent({
     .of_main {
       width: calc(100%);
       position: relative;
-      .m_header {
+      .ofm_header {
         display: flex;
         align-items: center;
         padding-top: 20px;
@@ -1788,29 +2331,36 @@ export default defineComponent({
           background-image: url(@/assets/images/coursewareManage/add1.png);
           background-size: 100% 100%;
         }
-        .add_exit {
+        .close_exit {
           position: absolute;
           right: 42px;
           cursor: pointer;
+          width: 20px;
+          height: 20px;
+          background-image: url(@/assets/images/coursewareManage/close.png);
+          background-size: 100% 100%;
         }
       }
-      .m_body {
-        width: 88%;
-        .checkbtn {
-          width: 7.8px;
-          height: 7.8px;
-          border: 1px solid #4ea6ff;
-          background-color: #4ea6ff;
-          border-radius: 50%;
+      .ofm_body {
+        width: 90%;
+        .ofmb_header{
+          display: flex;
+          align-items: center;
+          margin: 14px auto;
+          .sign{
+            width: 7px;
+            height: 7px;
+            margin-left: 78px;
+            margin-right: 6px;
+            background-image: url(@/assets/images/coursewareManage/asterisk.png);
+            background-size: 100% 100%;
+          }
         }
         .ol_checkbox {
-          width: 14px;
-          height: 14px;
-          border: 1px solid #000000;
-          border-radius: 50%;
           display: flex;
           align-items: center;
           justify-content: center;
+          margin-left:6px;
         }
         .b_header {
           display: flex;
@@ -1834,10 +2384,13 @@ export default defineComponent({
           display: flex;
           align-items: center;
           margin: 21px auto 14px 80px;
-          .bc_boxl,
-          .bc_boxr {
+          .bc_box{
             display: flex;
-            align-items: center;
+            .bc_boxl,
+            .bc_boxr {
+              display: flex;
+              align-items: center;
+            }
           }
         }
         .b_sup {
@@ -1845,12 +2398,16 @@ export default defineComponent({
           .bs_box {
             display: flex;
             align-items: center;
+            .bc_box{
+              display: flex;
+            }
           }
         }
         .b_footer {
           width: 100%;
           margin-left: 212px;
           margin-top: 25px;
+          margin-bottom: 20px;
           display: flex;
           .btn {
             width: 100px;
@@ -1883,9 +2440,8 @@ export default defineComponent({
 
   .faceteach {
     z-index: 999;
-    width: 1358px;
+    width: 85%;
     min-width: 1000px;
-    height: 805px;
     background: #ffffff;
     box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
     position: absolute;
@@ -1917,10 +2473,14 @@ export default defineComponent({
           background-image: url(@/assets/images/coursewareManage/add1.png);
           background-size: 100% 100%;
         }
-        .add_exit {
+        .close_exit {
           position: absolute;
           right: 42px;
           cursor: pointer;
+          width: 20px;
+          height: 20px;
+          background-image: url(@/assets/images/coursewareManage/close.png);
+          background-size: 100% 100%;
         }
       }
       .m_title {
@@ -1928,6 +2488,8 @@ export default defineComponent({
       }
       .m_body {
         display: flex;
+        height: 500px;
+        overflow: auto;
         .mb_left {
           .mbl_items1 {
             display: flex;
@@ -2021,7 +2583,7 @@ export default defineComponent({
               .accessory_icon {
                 width: 15px;
                 height: 15px;
-                background-color: #4ea6ff;
+                background-image: url(@/assets/images/coursewareManage/enclosure.png);
                 margin-right: 6px;
               }
             }
@@ -2033,52 +2595,28 @@ export default defineComponent({
 
   .tableBox {
     margin: 20px 38px 30px;
-    .op_box {
+    .operation {
       display: flex;
       justify-content: right;
-      .opacation {
-        font-size: 14px;
-        font-weight: 400;
-        color: #4ea6ff;
-        // line-height: 36px;
-        .activecls {
-          display: inline-block;
-        }
-        .errorCls {
-          display: none;
-        }
-        .more {
-          position: relative;
-          .moreArrow {
-            width: 13px;
-            height: 7px;
-            display: inline-block;
-            background-image: url("@/assets/images/navtop/down.png");
-            background-size: 100%;
-            margin: 2px;
-            margin-left: 7px;
-          }
-          .moreItems {
-            width: 80px;
-            // height: 70px;
-            display: none;
-            background: #ffffff;
-            box-shadow: 2px 3px 9px 3px rgba(0, 0, 0, 0.05);
-            border-radius: 3px;
-            border: 0px solid #dcdcdc;
-            align-items: center;
-            position: absolute;
-            left: 0px;
-            top: 18px;
-            z-index: 9999 !important;
+      .nSelect {
+        display: flex;
+        .nselect {
+          display: flex;
+          color: #4ea6ff;
+          font-size: 14px;
+          .ops1,.ops2,.ops3,.ops4,.ops5{
+            margin-left: 20px;
           }
+          // .jc {
+          //   margin-left: 20px;
+          // }
         }
-        .more:hover .moreArrow {
-          background-image: url("@/assets/images/navtop/up.png");
-        }
-        .more:hover .moreItems {
-          display: block;
-        }
+      }
+      .tableSelect {
+        margin-left: -30px;
+        display: flex;
+        align-items: center;
+        justify-content: right;
       }
     }
   }
@@ -2087,11 +2625,11 @@ export default defineComponent({
   .faceteachmanage {
     display: none;
     z-index: 999;
-    width: 1358px;
+    width: 85%;
     min-width: 1000px;
-    height: 537px;
-    background: #ffffff;
-    box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
+    // height: 537px;
+    background: #FFFFFF;
+    box-shadow: 0px 1px 35px 0px rgba(118,136,166,0.21);
     position: absolute;
     left: 50%;
     top: 50%;
@@ -2106,583 +2644,810 @@ export default defineComponent({
         rgba(78, 166, 255, 0) 100%
       );
     }
-    .om_main {
-      width: calc(100%);
-      position: relative;
-      .omm_header {
-        display: flex;
-        align-items: center;
-        padding-top: 20px;
-        padding-left: 26px;
-        font-size: 16px;
-        .pc_icon {
-          width: 16px;
-          height: 16px;
-          margin-right: 10px;
-          background-image: url(@/assets/images/coursewareManage/pc.png);
-        }
-        .pc_exit {
-          position: absolute;
-          right: 42px;
-          cursor: pointer;
-        }
-      }
-      .om_body {
-        width: calc(100% - 50px);
-        padding-left: 50px;
-        padding-top: 17px;
-        .b_title {
-          color: #4f5156;
-          font-weight: 500;
-          margin-bottom: 19px;
-        }
-        .b_sub {
-          display: flex;
-          margin-bottom: 10px;
-          .bs_type {
-            color: #999ba3;
-          }
-          .bs_left {
-            color: #999ba3;
-            margin-left: 35px;
-          }
-          .bs_right {
-            color: #4f5156;
-          }
-        }
-        .b_menu {
-          width: calc(100%);
-        }
-        .b_menunav {
-          display: flex;
-          margin-top: 20px;
-          margin-bottom: 20px;
-          .bm_select {
-            margin-right: 20px;
-          }
-          .bm_input {
-            margin-right: 20px;
-          }
-          .bm_btn {
+    .om_main{
+        width:calc(100%);
+        position: relative;
+        .omm_header{
             display: flex;
-            // flex-wrap: wrap;
-            .btn {
-              padding: 0px 26px 0px 26px;
-              height: 40px;
-              background: rgba(64, 158, 255, 0);
-              border-radius: 8px;
-              border: 1px solid rgba(64, 158, 255, 1);
-              display: flex;
-              align-items: center;
-              justify-content: center;
-              margin-right: 14px;
-              flex-shrink: 0;
-              .search {
-                background-size: 100%;
-              }
-              .btnText {
-                font-size: 14px;
-                font-weight: 400;
-                color: rgba(64, 158, 255, 1);
-                line-height: 36px;
-                margin-left: 5px;
-              }
+            align-items: center;
+            padding-top: 20px;
+            padding-left: 26px;
+            font-size: 16px;
+            .pc_icon{
+                width: 16px;
+                height: 16px;
+                margin-right: 10px;
+                background-image: url(@/assets/images/coursewareManage/pc.png);
+            }
+            .close_exit{
+                position: absolute;
+                right:42px;
+                cursor: pointer;
+                width: 20px;
+                height: 20px;
+                background-image: url(@/assets/images/coursewareManage/close.png);
+                background-size: 100% 100%;
+            }
+        }
+        .om_body{
+            width:calc(100% - 50px);
+            padding-left: 50px;
+            padding-top: 17px;
+            .b_title{
+                color: #4F5156;
+                font-weight: 500;
+                margin-bottom: 19px;
+            }
+            .b_sub{
+                display: flex;
+                margin-bottom: 10px;
+                .bs_type{
+                    color: #999BA3;
+                }
+                .bs_left{
+                    color: #999BA3;
+                    margin-left: 35px;
+                }
+                .bs_right{
+                    color: #4F5156;
+                }
+            }
+            .b_menu{
+                width:calc(100%);
+            }
+            .b_menunav{
+                display: flex;
+                margin-top: 20px;
+                margin-bottom: 20px;
+                .bm_select{
+                    margin-right: 20px;
+                }
+                .bm_input{
+                    margin-right: 20px;
+                }
+                .bm_btn {
+                display: flex;
+                // flex-wrap: wrap;
+                .btn {
+                    padding: 0px 26px 0px 26px;
+                    height: 40px;
+                    background: rgba(64, 158, 255, 0);
+                    border-radius: 8px;
+                    border: 1px solid rgba(64, 158, 255, 1);
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    margin-right: 14px;
+                    flex-shrink: 0;
+                    .search {
+                    background-size: 100%;
+                    }
+                    .btnText {
+                    font-size: 14px;
+                    font-weight: 400;
+                    color: rgba(64, 158, 255, 1);
+                    line-height: 36px;
+                    margin-left: 5px;
+                    }
+                }
+                .btn1 {
+                    .search {
+                    width: 15px;
+                    height: 17px;
+                    background-image: url("@/assets/images/coursewareManage/search1.png");
+                    }
+                }
+                .btn1:hover {
+                    background: rgba(64, 158, 255, 1);
+                    .search {
+                    background-image: url("@/assets/images/coursewareManage/search0.png");
+                    }
+                    .btnText {
+                    color: #ffffff;
+                    }
+                }
             }
-            .btn1 {
-              .search {
-                width: 15px;
-                height: 17px;
-                background-image: url("@/assets/images/coursewareManage/search1.png");
-              }
             }
-            .btn1:hover {
-              background: rgba(64, 158, 255, 1);
-              .search {
-                background-image: url("@/assets/images/coursewareManage/search0.png");
-              }
-              .btnText {
-                color: #ffffff;
-              }
-            }
-          }
         }
-      }
     }
   }
 
-  .ftsturecord {
+  .ftsturecord{
     z-index: 999;
-    width: 1358px;
+    width: 80%;
     min-width: 1000px;
-    height: 274px;
-    background: #ffffff;
-    box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
+    // height: 274px;
+    background: #FFFFFF;
+    box-shadow: 0px 1px 35px 0px rgba(118,136,166,0.21);
     position: absolute;
     left: 50%;
     top: 50%;
-    transform: translate(-50%, -50%);
+    transform: translate(-50%,-50%);
     overflow: auto;
-    .ftsr_header {
-      position: absolute;
-      width: calc(100%);
-      height: 40px;
-      background: linear-gradient(
-        rgba(78, 166, 255, 0.2) 0%,
-        rgba(78, 166, 255, 0) 100%
-      );
-    }
-    .ftsr_main {
-      width: calc(100%);
-      position: relative;
-      .m_header {
-        display: flex;
-        align-items: center;
-        padding-top: 20px;
-        padding-left: 26px;
-        font-size: 16px;
-        .det_icon {
-          width: 16px;
-          height: 16px;
-          margin-right: 10px;
-          background-image: url(@/assets/images/coursewareManage/detail.png);
-          background-size: 100% 100%;
-        }
-        .det_exit {
-          position: absolute;
-          right: 42px;
-          cursor: pointer;
-        }
-      }
-      .ftsr_table {
-        width: 90%;
-        margin: 30px auto;
-        border: 1px solid #f0f4fe;
-      }
-      .ftsr_btn {
-        width: 100px;
+    .ftsr_header{
+        position: absolute;
+        width:calc(100%);
         height: 40px;
-        background: #ffffff;
-        border: 1px solid #4ea6ff;
-        border-radius: 8px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        margin: 30px auto;
-        flex-shrink: 0;
-        cursor: pointer;
-        .btnText {
-          color: #4ea6ff;
+        background: linear-gradient( rgba(78,166,255,0.2) 0%, rgba(78,166,255,0) 100%);
+    }
+    .ftsr_main{
+        width:calc(100%);
+        position: relative;
+        .m_header{
+            display: flex;
+            align-items: center;
+            padding-top: 20px;
+            padding-left: 26px;
+            font-size: 16px;
+            .det_icon{
+                width: 16px;
+                height: 16px;
+                margin-right: 10px;
+                background-image: url(@/assets/images/coursewareManage/detail.png);
+                background-size: 100% 100%;
+            }
+            .det_exit{
+                position: absolute;
+                right:42px;
+                cursor: pointer;
+                width: 20px;
+                height: 20px;
+                background-image: url(@/assets/images/coursewareManage/close.png);
+                background-size: 100% 100%;
+            }
+        }
+        .ftsr_table{
+          width: 90%;
+          margin:30px auto;
+          border: 1px solid #F0F4FE;
+        }
+        .ftsr_btn {
+            width: 100px;
+            height: 40px;
+            background: #ffffff;
+            border: 1px solid #4EA6FF;
+            border-radius: 8px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin: 30px auto ;
+            flex-shrink: 0;
+            cursor: pointer;
+            .btnText {
+              color: #4EA6FF;
+              font-size: 14px;
+              font-weight: 400;
+              line-height: 40px;
+            }
+        }
+      }
+    }
+  .givepower{
+    z-index: 999;
+    width: 85%;
+    min-width: 1000px;
+    // height: 646px;
+    background: #FFFFFF;
+    box-shadow: 0px 1px 35px 0px rgba(118,136,166,0.21);
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%,-50%);
+    overflow: auto;
+    .gp_header{
+        position: absolute;
+        width:calc(100%);
+        height: 40px;
+        background: linear-gradient( rgba(78,166,255,0.2) 0%, rgba(78,166,255,0) 100%);
+    }
+    .gp_main{
+        width:calc(100%);
+        position: relative;
+        .gpm_header{
+            display: flex;
+            align-items: center;
+            padding-top: 20px;
+            padding-left: 26px;
+            font-size: 16px;
+            .givepower_icon{
+                width: 16px;
+                height: 16px;
+                margin-right: 10px;
+                background-image: url(@/assets/images/coursewareManage/givepower.png);
+                background-size: 100% 100%;
+            }
+            .close_exit{
+                position: absolute;
+                right:42px;
+                cursor: pointer;
+                width: 20px;
+                height: 20px;
+                background-image: url(@/assets/images/coursewareManage/close.png);
+                background-size: 100% 100%;
+            }
+        }
+        .gpm_inputbtn{
+          width: 90%;
+          margin: 20px auto;
+          display: flex;
+          .gpm_btn {
+            width: 100px;
+            height: 40px;
+            margin-right: 14px;
+            background: #ffffff;
+            border: 1px solid #4EA6FF;
+            border-radius: 8px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            flex-shrink: 0;
+            cursor: pointer;
+            .btnText {
+              color: #4EA6FF;
+              font-size: 14px;
+              font-weight: 400;
+              line-height: 40px;
+            }
+          }
+          .btn1 {
+            .search {
+              width: 15px;
+              height: 17px;
+              margin-right: 6px;
+              background-image: url("../../assets/images/courseManage/search1.png");
+            }
+          }
+          .btn2 {
+            .reset {
+              width: 16px;
+              height: 18px;
+              margin-right: 6px;
+              background-image: url("../../assets/images/courseManage/reset1.png");
+            }
+          }
+          .btn1:hover {
+            background: #4EA6FF;
+            .search {
+              background-image: url("@/assets/images/coursewareManage/search0.png");
+            }
+            .btnText {
+              color: #ffffff;
+            }
+          }
+          .btn2:hover {
+            background: #4EA6FF;
+            .reset {
+              background-image: url("@/assets/images/coursewareManage/reset0.png");
+            }
+            .btnText {
+              color: #ffffff;
+            }
+          }
+        }
+        .gpm_notice{
+          display: flex;
+          background: rgba(78,166,255,0.25);
+          border: 1px solid #4EA6FF;
+          width: 90%;
+          height: 62px;
+          margin:20px auto;
+          align-items: center;
+          line-height: 64px;
+          .th_icon{
+            width: 16px;
+            height: 16px;
+            background-image: url(@/assets/images/coursewareManage/gan.png);
+            background-size: 100% 100%;
+            margin: auto 13px auto 37px;
+          }
+          .textarea{
+            margin-right: 33px;
+          }
+        }
+        .gpm_table{
+          width: 90%;
+          margin:30px auto;
+          border: 1px solid #F0F4FE;
+        }
+      }
+    }
+  .schooltime{
+    z-index: 999;
+    width: 85%;
+    min-width: 1000px;
+    // height: 646px;
+    background: #FFFFFF;
+    box-shadow: 0px 1px 35px 0px rgba(118,136,166,0.21);
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%,-50%);
+    overflow: auto;
+    .st_header{
+        position: absolute;
+        width:calc(100%);
+        height: 40px;
+        background: linear-gradient( rgba(78,166,255,0.2) 0%, rgba(78,166,255,0) 100%);
+    }
+    .st_main{
+        width:calc(100%);
+        position: relative;
+        .stm_header{
+            display: flex;
+            align-items: center;
+            padding-top: 20px;
+            padding-left: 26px;
+            font-size: 16px;
+            .scht_icon{
+                width: 16px;
+                height: 16px;
+                margin-right: 10px;
+                background-image: url(@/assets/images/coursewareManage/scht.png);
+                background-size: 100% 100%;
+            }
+            .close_exit{
+                position: absolute;
+                right:42px;
+                cursor: pointer;
+                width: 20px;
+                height: 20px;
+                background-image: url(@/assets/images/coursewareManage/close.png);
+                background-size: 100% 100%;
+            }
+        }
+        .stm_inputbtn{
+          display: flex;
+          width: 90%;
+          margin: 20px auto;
+          .stm_btn {
+            width: 100px;
+            height: 40px;
+            margin-right: 14px;
+            background: #ffffff;
+            border: 1px solid #4EA6FF;
+            border-radius: 8px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            flex-shrink: 0;
+            cursor: pointer;
+            .btnText {
+              color: #4EA6FF;
+              font-size: 14px;
+              font-weight: 400;
+              line-height: 40px;
+            }
+          }
+          .btn1 {
+            .search {
+              width: 15px;
+              height: 17px;
+              margin-right: 6px;
+              background-image: url("@/assets/images/coursewareManage/search1.png");
+            }
+          }
+          .btn2 {
+            .reset {
+              width: 16px;
+              height: 18px;
+              margin-right: 6px;
+              background-image: url("@/assets/images/coursewareManage/reset1.png");
+            }
+          }
+          .btn1:hover {
+            background: #4EA6FF;
+            .search {
+              background-image: url("@/assets/images/coursewareManage/search0.png");
+            }
+            .btnText {
+              color: #ffffff;
+            }
+          }
+          .btn2:hover {
+            background: #4EA6FF;
+            .reset {
+              background-image: url("@/assets/images/coursewareManage/reset0.png");
+            }
+            .btnText {
+              color: #ffffff;
+            }
+          }
+        }
+        .stm_btn3{
+            width: 130px;
+            height: 40px;
+            border: 1px solid #4EA6FF;
+            background-color: #4EA6FF;
+            border-radius: 8px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            flex-shrink: 0;
+            cursor: pointer;
+            .btnText {
+              font-size: 14px;
+              font-weight: 400;
+              line-height: 40px;
+            }
+          .btn3 {
+            .add {
+              width: 17px;
+              height: 18px;
+              background-image: url("@/assets/images/coursewareManage/add0.png");
+              background-size: 100% 100%;
+              margin-right: 6px;
+            }
+          }
+        }
+
+        .stm_table{
+          width: 90%;
+          margin:30px auto;
+          border: 1px solid #F0F4FE;
+        }
+        .opacation {
           font-size: 14px;
           font-weight: 400;
-          line-height: 40px;
+          color: #4ea6ff;
+          // line-height: 36px;
+          .more {
+            position: relative;
+            .moreArrow {
+              width: 13px;
+              height: 7px;
+              display: inline-block;
+              background-image: url("../../assets/images/navtop/down.png");
+              background-size: 100%;
+              margin: 2px;
+              margin-left: 7px;
+            }
+            .moreItems {
+              width: 80px;
+              height: 70px;
+              display: none;
+              background: #ffffff;
+              box-shadow: 2px 3px 9px 3px rgba(0, 0, 0, 0.05);
+              border-radius: 3px;
+              border: 0px solid #dcdcdc;
+              position: absolute;
+              left: 0px;
+              top: 18px;
+              z-index: 100;
+            }
+          }
+          .more:hover .moreArrow {
+            background-image: url("../../assets/images/navtop/up.png");
+          }
+          .more:hover .moreItems {
+            display: block;
+          }
         }
       }
     }
-  }
-  .givepower {
-    z-index: 999;
-    width: 1358px;
-    min-width: 1000px;
-    height: 646px;
-    background: #ffffff;
-    box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
-    position: absolute;
-    left: 50%;
-    top: 50%;
-    transform: translate(-50%, -50%);
-    overflow: auto;
-    .gp_header {
-      position: absolute;
-      width: calc(100%);
-      height: 40px;
-      background: linear-gradient(
-        rgba(78, 166, 255, 0.2) 0%,
-        rgba(78, 166, 255, 0) 100%
-      );
-    }
-    .gp_main {
-      width: calc(100%);
-      position: relative;
-      .gpm_header {
-        display: flex;
-        align-items: center;
-        padding-top: 20px;
-        padding-left: 26px;
-        font-size: 16px;
-        .pc_icon {
-          width: 16px;
-          height: 16px;
-          margin-right: 10px;
-          background-image: url(@/assets/images/coursewareManage/detail.png);
-          background-size: 100% 100%;
-        }
-        .pc_exit {
-          position: absolute;
-          right: 42px;
-          cursor: pointer;
-        }
-      }
-      .gpm_inputbtn {
-        display: flex;
-        width: 90%;
-        margin: 20px auto;
-        .gpm_btn {
-          width: 100px;
-          height: 40px;
-          margin-right: 14px;
-          background: #ffffff;
-          border: 1px solid #4ea6ff;
-          border-radius: 8px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          flex-shrink: 0;
-          cursor: pointer;
-          .btnText {
-            color: #4ea6ff;
-            font-size: 14px;
-            font-weight: 400;
-            line-height: 40px;
-          }
-        }
-        .btn1 {
-          .search {
-            width: 15px;
-            height: 17px;
-            background-image: url("../../assets/images/courseManage/search1.png");
-          }
-        }
-        .btn2 {
-          .search {
-            width: 16px;
-            height: 18px;
-            background-image: url("../../assets/images/courseManage/reset1.png");
-          }
-        }
-        .btn1:hover {
-          background: rgba(64, 158, 255, 1);
-          .search {
-            background-image: url("../../assets/images/courseManage/search0.png");
-          }
-          .btnText {
-            color: #ffffff;
-          }
-        }
-        .btn2:hover {
-          background: rgba(64, 158, 255, 1);
-          .search {
-            background-image: url("../../assets/images/courseManage/reset0.png");
-          }
-          .btnText {
-            color: #ffffff;
-          }
-        }
-      }
-      .gpm_notice {
-        width: 90%;
-        height: 49px;
-        margin: 0 auto;
-        background-color: rgba(125, 190, 255, 0.25);
-        display: flex;
-        align-items: center;
-        .th_icon {
-          width: 16px;
-          height: 16px;
-          margin-left: 37px;
-          margin-right: 13px;
-          border-radius: 50%;
-          background-color: #4ea6ff;
-          font-weight: bold;
-          color: #ffffff;
-          text-align: center;
-          line-height: 16px;
-        }
-        .textarea {
-          margin-right: 33px;
-        }
-      }
-      .gpm_table {
-        width: 90%;
-        margin: 30px auto;
-        border: 1px solid #f0f4fe;
-      }
-    }
-  }
-  .schooltime {
-    z-index: 999;
-    width: 1358px;
-    min-width: 1000px;
-    height: 646px;
-    background: #ffffff;
-    box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
-    position: absolute;
-    left: 50%;
-    top: 50%;
-    transform: translate(-50%, -50%);
-    overflow: auto;
-    .st_header {
-      position: absolute;
-      width: calc(100%);
-      height: 40px;
-      background: linear-gradient(
-        rgba(78, 166, 255, 0.2) 0%,
-        rgba(78, 166, 255, 0) 100%
-      );
-    }
-    .st_main {
-      width: calc(100%);
-      position: relative;
-      .stm_header {
-        display: flex;
-        align-items: center;
-        padding-top: 20px;
-        padding-left: 26px;
-        font-size: 16px;
-        .pc_icon {
-          width: 16px;
-          height: 16px;
-          margin-right: 10px;
-          background-image: url(@/assets/images/coursewareManage/detail.png);
-          background-size: 100% 100%;
-        }
-        .pc_exit {
-          position: absolute;
-          right: 42px;
-          cursor: pointer;
-        }
-      }
-      .stm_inputbtn {
-        display: flex;
-        width: 90%;
-        margin: 20px auto;
-        .stm_btn {
-          width: 100px;
-          height: 40px;
-          margin-right: 14px;
-          background: #ffffff;
-          border: 1px solid #4ea6ff;
-          border-radius: 8px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          flex-shrink: 0;
-          cursor: pointer;
-          .btnText {
-            color: #4ea6ff;
-            font-size: 14px;
-            font-weight: 400;
-            line-height: 40px;
-          }
-        }
-        .btn1 {
-          .search {
-            width: 15px;
-            height: 17px;
-            background-image: url("../../assets/images/courseManage/search1.png");
-          }
-        }
-        .btn2 {
-          .search {
-            width: 16px;
-            height: 18px;
-            background-image: url("../../assets/images/courseManage/reset1.png");
-          }
-        }
-        .btn3 {
-          .search {
-            width: 17px;
-            height: 18px;
-            background-image: url("../../assets/images/courseManage/add1.png");
-            margin-right: 5px;
-          }
-        }
-        .btn1:hover {
-          background: rgba(64, 158, 255, 1);
-          .search {
-            background-image: url("../../assets/images/courseManage/search0.png");
-          }
-          .btnText {
-            color: #ffffff;
-          }
-        }
-        .btn2:hover {
-          background: rgba(64, 158, 255, 1);
-          .search {
-            background-image: url("../../assets/images/courseManage/reset0.png");
-          }
-          .btnText {
-            color: #ffffff;
-          }
-        }
-        .btn3:hover {
-          background: rgba(64, 158, 255, 1);
-          .search {
-            background-image: url("../../assets/images/courseManage/add0.png");
-          }
-          .btnText {
-            color: #ffffff;
-          }
-        }
-      }
-      .stm_table {
-        width: 90%;
-        margin: 30px auto;
-        border: 1px solid #f0f4fe;
-      }
-      .opacation {
-        font-size: 14px;
-        font-weight: 400;
-        color: #4ea6ff;
-        // line-height: 36px;
-        .more {
-          position: relative;
-          .moreArrow {
-            width: 13px;
-            height: 7px;
-            display: inline-block;
-            background-image: url("../../assets/images/navtop/down.png");
-            background-size: 100%;
-            margin: 2px;
-            margin-left: 7px;
-          }
-          .moreItems {
-            width: 80px;
-            height: 70px;
-            display: none;
-            background: #ffffff;
-            box-shadow: 2px 3px 9px 3px rgba(0, 0, 0, 0.05);
-            border-radius: 3px;
-            border: 0px solid #dcdcdc;
-            position: absolute;
-            left: 0px;
-            top: 18px;
-            z-index: 100;
-          }
-        }
-        .more:hover .moreArrow {
-          background-image: url("../../assets/images/navtop/up.png");
-        }
-        .more:hover .moreItems {
-          display: block;
-        }
-      }
-    }
-  }
-  .createschooltime {
+  .createschooltime{
     z-index: 999;
     width: 679px;
-    height: 705px;
-    background: #ffffff;
-    box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
+    // height: 705px;
+    background: #FFFFFF;
+    box-shadow: 0px 1px 35px 0px rgba(118,136,166,0.21);
     position: absolute;
     left: 50%;
     top: 50%;
-    transform: translate(-50%, -50%);
+    transform: translate(-50%,-50%);
     overflow: auto;
-    .cst_header {
-      position: absolute;
-      width: calc(100%);
-      height: 40px;
-      background: linear-gradient(
-        rgba(78, 166, 255, 0.2) 0%,
-        rgba(78, 166, 255, 0) 100%
-      );
+    .cst_header{
+        position: absolute;
+        width:calc(100%);
+        height: 40px;
+        background: linear-gradient( rgba(78,166,255,0.2) 0%, rgba(78,166,255,0) 100%);
     }
-    .cst_main {
-      width: calc(100%);
-      position: relative;
-      .cstm_header {
-        display: flex;
-        align-items: center;
-        padding-top: 20px;
-        padding-left: 26px;
-        font-size: 16px;
-        .add_icon {
-          width: 16px;
-          height: 16px;
-          margin-right: 10px;
-          background-image: url(@/assets/images/coursewareManage/add1.png);
-          background-size: 100% 100%;
-        }
-        .add_exit {
-          position: absolute;
-          right: 42px;
-          cursor: pointer;
-        }
-      }
-      .cstm_title {
-        margin: 10px auto 20px 51px;
-        font-weight: bold;
-      }
-      .cstm_items {
-        display: flex;
-        align-items: center;
-        margin-bottom: 23px;
-      }
-      .items1,
-      .items4 {
-        margin-left: 80px;
-      }
-      .items2 {
-        margin-left: 108px;
-      }
-      .items3,
-      .items5,
-      .items6,
-      .items7,
-      .items8 {
-        margin-left: 86px;
-      }
-      .items9 {
-        margin-left: 115px;
-        text-align: center;
-        margin-bottom: 0;
-        .items9box {
-          display: flex;
-          .upload_box {
+    .cst_main{
+        width:calc(100%);
+        position: relative;
+        .cstm_header{
             display: flex;
+            align-items: center;
+            padding-top: 20px;
+            padding-left: 26px;
+            font-size: 16px;
+            .add_icon{
+                width: 16px;
+                height: 16px;
+                margin-right: 10px;
+                background-image: url(@/assets/images/coursewareManage/add1.png);
+                background-size: 100% 100%;
+            }
+            .close_exit{
+                position: absolute;
+                right:42px;
+                cursor: pointer;
+                width: 20px;
+                height: 20px;
+                background-image: url(@/assets/images/coursewareManage/close.png);
+                background-size: 100% 100%;
+            }
+        }
+        .cstm_title{
+          margin: 10px auto 20px 51px;
+          font-weight: bold;
+        }
+        .cstm_items{
+          display: flex;
+          align-items: center;
+          margin-bottom: 23px;
+        }
+        .items1,.items4{
+          margin-left: 80px;
+        }
+        .items2{
+          margin-left: 108px;
+        }
+        .items3,.items5,.items6,.items7,.items8{
+          margin-left: 86px;
+        }
+        .items9{
+          margin-left: 115px;
+          text-align: center;
+          margin-bottom: 0;
+          .items9box{
+            display: flex;
+            .upload_box{
+              display: flex;
+              cursor: pointer;
+              .upload_icon{
+                width: 16px;
+                height: 16px;
+                background-image: url('@/assets/images/coursewareManage/enclosure.png');
+                background-size: 100% 100%;
+                margin-right: 5px;
+              }
+            }
+          }
+        }
+        .items10{
+          display: flex;
+          justify-content: center;
+          margin-top: 20px;
+          margin-bottom: 20px;
+          .cstm_btn{
+            width: 100px;
+            height: 40px;
+            background: rgba(64, 158, 255, 0);
+            border-radius: 8px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin-right: 14px;
+            flex-shrink: 0;
             cursor: pointer;
-            .upload_icon {
-              width: 16px;
-              height: 16px;
-              background-color: blue;
-              background-size: 100% 100%;
-              margin-right: 5px;
+            .btnText {
+              font-size: 14px;
+              font-weight: 400;
+              line-height: 40px;
+            }
+          }
+          .btn5 {
+            border: 1px solid rgba(64, 158, 255, 1);
+            color: #4ea6ff;
+          }
+          .btn6 {
+            background-color: #4ea6ff;
+            color: #ffffff;
+          }
+          
+        }
+      }
+    }
+  .studentsmanage{
+    z-index: 999;
+    width: 85%;
+    min-width: 1000px;
+    // height: 646px;
+    background: #FFFFFF;
+    box-shadow: 0px 1px 35px 0px rgba(118,136,166,0.21);
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%,-50%);
+    overflow: auto;
+    .stm_header{
+        position: absolute;
+        width:calc(100%);
+        height: 40px;
+        background: linear-gradient( rgba(78,166,255,0.2) 0%, rgba(78,166,255,0) 100%);
+    }
+    .stm_main{
+        width:calc(100%);
+        position: relative;
+        .stmm_header{
+            display: flex;
+            align-items: center;
+            padding-top: 20px;
+            padding-left: 26px;
+            font-size: 16px;
+            .stum_icon{
+                width: 16px;
+                height: 16px;
+                margin-right: 10px;
+                background-image: url(@/assets/images/coursewareManage/stum.png);
+                background-size: 100% 100%;
+            }
+            .close_exit{
+                position: absolute;
+                right:42px;
+                cursor: pointer;
+                width: 20px;
+                height: 20px;
+                background-image: url(@/assets/images/coursewareManage/close.png);
+                background-size: 100% 100%;
+            }
+        }
+        .stmmitems{
+          margin: auto 49px;
+          height: 400px;
+          overflow: auto;
+          .stmm_i1,
+          .stmm_i2,
+          .stmm_i3,
+          .stmm_i4{
+            margin: 19px 0;
+          }
+          .stmm_i5{
+            display: flex;
+            justify-content: space-between;
+            .i5_left{
+              display: flex;
+              .stmm_btn {
+                width: 100px;
+                height: 40px;
+                margin-right: 14px;
+                background: #ffffff;
+                border: 1px solid #4EA6FF;
+                border-radius: 8px;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                flex-shrink: 0;
+                cursor: pointer;
+                .btnText {
+                  color: #4EA6FF;
+                  font-size: 14px;
+                  font-weight: 400;
+                  line-height: 40px;
+                }
+              }
+              .btn1 {
+                .search {
+                  width: 15px;
+                  height: 17px;
+                  margin-right: 6px;
+                  background-image: url("../../assets/images/courseManage/search1.png");
+                }
+              }
+              .btn2 {
+                .reset {
+                  width: 16px;
+                  height: 18px;
+                  margin-right: 6px;
+                  background-image: url("../../assets/images/courseManage/reset1.png");
+                }
+              }
+              .btn1:hover {
+                background: rgba(64, 158, 255, 1);
+                .search {
+                  background-image: url("../../assets/images/courseManage/search0.png");
+                }
+                .btnText {
+                  color: #ffffff;
+                }
+              }
+              .btn2:hover {
+                background: rgba(64, 158, 255, 1);
+                .reset {
+                  background-image: url("../../assets/images/courseManage/reset0.png");
+                }
+                .btnText {
+                  color: #ffffff;
+                }
+              }
+            }
+            .i5_right{
+              display: flex;
+              .stmm_btn {
+                width: 100px;
+                height: 40px;
+                margin-right: 14px;
+                background: #ffffff;
+                border: 1px solid #4EA6FF;
+                border-radius: 8px;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                flex-shrink: 0;
+                cursor: pointer;
+                .btnText {
+                  color: #4EA6FF;
+                  font-size: 14px;
+                  font-weight: 400;
+                  line-height: 40px;
+                }
+              }
+              .btn3 {
+                background-color: #4EA6FF;
+              }
+              .btn4{
+                display: flex;
+                flex-direction: column;
+                position: relative;
+                .btn4_sub{
+                  display: flex;
+                  justify-content: center;
+                  align-items: center;
+                  .b_zk{
+                    width: 10px;
+                    height: 8px;
+                    background-image: url('@/assets/images/coursewareManage/down.png');
+                    background-size: 100% 100%;
+                  }
+                  .b_sq{
+                    width: 10px;
+                    height: 8px;
+                    background-image: url('@/assets/images/coursewareManage/up.png');
+                    background-size: 100% 100%;
+                  }
+                }
+                .btn4_sup{
+                  width: 100%;
+                  display: flex;
+                  flex-direction: column;
+                  background-color: #ffffff;
+                  box-shadow: 0px 1px 35px 0px rgba(118,136,166,0.21);
+                  position: absolute;
+                  top: 40px;
+                  z-index: 999;
+                  .btn4_tit{
+                    margin-top:8px;
+                    margin-left:8px;
+                  }
+                  .btn4_op1,.btn4_op2,.btn4_op3{
+                    margin-left: 20px;
+                  }
+                }
+              }
+              .btn5 {
+                margin-right: 0px;
+                .export {
+                  width: 17px;
+                  height: 18px;
+                  margin-right: 5px;
+                  background-image: url("@/assets/images/coursewareManage/export.png");
+                }
+              }
+              .btn5:hover {
+                background: #4EA6FF;
+                .export {
+                  background-image: url("@/assets/images/coursewareManage/export1.png");
+                }
+                .btnText {
+                  color: #ffffff;
+                }
+              }
+            }
+          }
+          .stmm_i6{
+            margin-top:20px;
+            .operation,.nselect{
+              display: flex;
+              justify-content: center;
+              color: #4EA6FF;
+              font-size: 14px;
+              .ops1,.ops2{
+                margin-right: 10px;
+              }
             }
           }
         }
       }
-      .items10 {
-        display: flex;
-        justify-content: center;
-        margin-top: 20px;
-        .cstm_btn {
-          width: 100px;
-          height: 40px;
-          background: rgba(64, 158, 255, 0);
-          border-radius: 8px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          margin-right: 14px;
-          flex-shrink: 0;
-          cursor: pointer;
-          .btnText {
-            font-size: 14px;
-            font-weight: 400;
-            line-height: 40px;
-          }
-        }
-        .btn5 {
-          border: 1px solid rgba(64, 158, 255, 1);
-          color: #4ea6ff;
-        }
-        .btn6 {
-          background-color: #4ea6ff;
-          color: #ffffff;
-        }
-      }
-    }
   }
 }
 </style>
diff --git a/src/views/learningpath/LearningPath.vue b/src/views/learningpath/LearningPath.vue
index b1476f3e..3e404ded 100644
--- a/src/views/learningpath/LearningPath.vue
+++ b/src/views/learningpath/LearningPath.vue
@@ -137,8 +137,22 @@
               @click="chooseImg(item.id)"
               v-for="item in imgData"
               :key="item.key"
+              style="
+                border-radius: 8px;
+                width: 136px;
+                height: 106px;
+                background-size: 100%;
+                background-repeat: no-repeat;
+              "
+              :style="{
+                border:
+                  learnPathBg === item.id
+                    ? '2px solid rgba(78, 166, 255, 1)'
+                    : '2px solid rgba(78, 166, 255, 0)',
+                'background-image': 'url(' + item.source + ')',
+              }"
             >
-              <img class="im" :src="item.source" />
+              <!-- <img class="im" :src="item.source" /> -->
             </div>
           </div>
         </div>
@@ -245,6 +259,7 @@ export default {
           source: require("../../assets/images/leveladd/3.png"),
         },
       ],
+      learnPathBg: null, //选择的路径图背景
       currentPage: 1,
       tableDataTotal: 100,
       pageSize: 10,
@@ -371,6 +386,7 @@ export default {
     };
     const chooseImg = (id) => {
       console.log(id);
+      state.learnPathBg = id;
     };
     const getTableDate = () => {
       let data = state.tableData;
diff --git a/src/views/learningpath/LevelAdd.vue b/src/views/learningpath/LevelAdd.vue
index 8800568b..0ee1ef9e 100644
--- a/src/views/learningpath/LevelAdd.vue
+++ b/src/views/learningpath/LevelAdd.vue
@@ -48,7 +48,7 @@
             <div class="sametab">
               <div class="Lhead">
                 <a-input
-                  v-model:value="value"
+                  v-model:value="gatename"
                   style="width: 270px; height: 40px; border-radius: 8px"
                   placeholder="关卡名称"
                 />
@@ -268,6 +268,7 @@ export default {
   methods: {},
   setup() {
     const state = reactive({
+      gatename: null, //关卡名称
       projectNameList: [
         {
           id: 1,
@@ -354,7 +355,7 @@ export default {
   },
 };
 </script>
-<style scoped lang="scss">
+<style lang="scss">
 .clearfix:before,
 .clearfix:after {
   content: " ";
@@ -513,6 +514,11 @@ export default {
       margin-top: 10px;
       // margin-left: 10px;
     }
+    .ant-tabs > .ant-tabs-nav,
+    .ant-tabs > div > .ant-tabs-nav {
+      margin-left: 0px !important;
+      padding-left: 32px !important;
+    }
     .cont {
       display: flex;
       .pad {
diff --git a/src/views/learningpath/LevelAddDetail.vue b/src/views/learningpath/LevelAddDetail.vue
index f1dc5245..32c7e08c 100644
--- a/src/views/learningpath/LevelAddDetail.vue
+++ b/src/views/learningpath/LevelAddDetail.vue
@@ -247,6 +247,11 @@
               :scroll="{ x: 1500, y: 300 }"
               @expand="expandTable"
               :pagination="false"
+              :row-selection="{
+                columnWidth: '40px',
+                selectedRowKeys: selectedRowKeys,
+                onChange: onSelectChange,
+              }"
             />
             <!-- :pagination= showSizeChanger: true, showQuickJumper: true,
       hideOnSinglePage: true, pageSizeOptions: [], pageSize: pageSize, current:
@@ -374,16 +379,11 @@ export default {
       projectNameList2: [
         {
           id: 1,
-          value: "批量操作",
-          label: "批量操作",
-        },
-        {
-          id: 2,
           value: "删除任务",
           label: "删除任务",
         },
         {
-          id: 3,
+          id: 2,
           value: "移动任务到关卡",
           label: "移动任务到关卡",
         },
@@ -556,6 +556,7 @@ export default {
       tableDataTotal: 100,
       pageSize: 10,
       visible: false,
+      selectedRowKeys: [],
     });
     const selectProjectName = (value, index) => {
       console.log("value", value, index);
@@ -576,18 +577,29 @@ export default {
           dataIndex: "state",
           // width: "30%",
           key: "state",
-          width: 90,
-          align: "center",
-          className: "h",
+          width: 40,
+          align: "left",
+          className: "classify",
           scopedSlots: { customRender: "action" }, //引入的插槽
           customRender: (text) => {
-            console.log(text.record.checked1);
+            // console.log(text.record.checked1);
             return (
               <div class="racona">
-                <div class="img"></div>
-                <a-checkbox class="ch" v-model:checked={text.record.checkedd}>
+                <div
+                  class="img"
+                  style={{ cursor: "pointer" }}
+                  onClick={() => {
+                    console.log("点击了");
+                  }}
+                ></div>
+                <span> {text.record.lei}</span>
+
+                {/**
+								<div class="img"></div>
+                <a-checkbox class="ch" checked={text.record.checkedd}>
                   {text.record.lei}
                 </a-checkbox>
+*/}
               </div>
             );
           },
@@ -610,15 +622,19 @@ export default {
           className: "h",
           scopedSlots: { customRender: "action" }, //引入的插槽
           customRender: (text) => {
-            console.log(text.record.checked1);
+            // console.log(text.record.checked1);
             return (
               <div class="opat">
                 <div class="opacationt clearfix">
                   <a-switch
                     style="margin-left:-50px;margin-top:3px"
-                    v-model:checked={text.record.checked1}
+                    checked={text.record.checked1}
                     size="small"
                     active-color="red"
+                    onClick={() => {
+                      console.log("点击了");
+                      text.record.checked1 = !text.record.checked1;
+                    }}
                   />
                   <div class="showt clearfix">
                     <div
@@ -669,6 +685,11 @@ export default {
       return columns;
     };
 
+    const onSelectChange = (selectedRowKeys) => {
+      console.log("selectedRowKeys changed: ", selectedRowKeys);
+      state.selectedRowKeys = selectedRowKeys;
+    };
+
     return {
       ...toRefs(state),
       selectProjectName,
@@ -677,12 +698,13 @@ export default {
       showDrawer,
       afterVisibleChange,
       drawercolumns,
+      onSelectChange,
     };
   },
 };
 </script>
 
-<style  lang="scss" >
+<style lang="scss">
 .clearfix:after,
 .clearfix:before {
   content: " ";
@@ -1103,6 +1125,21 @@ export default {
           }
         }
         .tableBox {
+          .classify {
+            margin-left: 10px !important;
+            padding-left: 9px !important;
+          }
+          .ant-checkbox-wrapper {
+            align-items: center;
+            margin-top: -2px;
+          }
+          .ant-table-selection-column {
+            padding: 0px !important;
+            padding-left: 68px !important;
+          }
+          .ant-table-thead > tr > th {
+            background-color: rgba(239, 244, 252, 1);
+          }
           // margin: 20px 38px 30px;
           th.h {
             background-color: #eff4fc !important;
@@ -1186,18 +1223,20 @@ export default {
     // background-color: #bfa;
     display: flex;
     align-items: center;
-    justify-content: center;
+    // justify-content: center;
     height: 100%;
     .img {
-      margin-left: -40px;
-      margin-top: -2px;
+      // margin-left: -40px;
+      // margin-top: -2px;
       width: 17px;
       height: 14px;
       background-image: url("../../assets/images/leveladd/z1.png");
+      position: absolute;
+      left: -47px;
     }
     .ch {
       margin-left: 10px;
     }
   }
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/projectcenter/TaskAdd.vue b/src/views/projectcenter/TaskAdd.vue
new file mode 100644
index 00000000..1a642635
--- /dev/null
+++ b/src/views/projectcenter/TaskAdd.vue
@@ -0,0 +1,1208 @@
+<template>
+  <div class="allCon">
+    <div class="left clearfix">
+      <div class="leftmain">
+        <div class="tit">阶段<img src="../../assets/images/projectadd/right.png" style="margin-left: 10px"/></div>
+        <div class="btn btn3">
+          <div class="search"></div>
+          <div class="btnText">添加阶段</div>
+        </div>
+        <div class="maincon">
+          <div class="item" v-for="item in level" :key="item.id">
+            <div class="itemle">
+              <div class="tit">{{ item.tit }}</div>
+              <div class="name">{{ item.name }}</div>
+            </div>
+            <div class="itemri">
+              <img src="../../assets/images/leveladd/z1.png" />
+              <img
+                style="margin-top: 40px"
+                src="../../assets/images/leveladd/z2.png"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="right">
+      <div class="addhead">
+        <div class="filt">
+          <div class="le">
+            <div class="leftimg">
+              <img class="img" src="../../assets/images/projectadd/picture.png" />
+            </div>
+            <div class="imgfor">
+              <div class="forz" style="font-weight: 500">管理者进阶-腾飞班</div>
+            </div>
+          </div>
+          <div class="rightt">
+            <div class="select">
+              <a-select
+                v-model:value="projectName"
+                style="width: 270px"
+                placeholder="自由学习模式"
+                :options="projectNameList"
+                @change="selectProjectName"
+                allowClear
+                showSearch
+              ></a-select>
+            </div>
+            <div class="line"></div>
+            <img class="img2" src="../../assets/images/projectadd/keep.png" />
+            <div class="pub">保存</div>
+            <div class="line"></div>
+            <img class="img2" src="../../assets/images/leveladd/back.png" />
+            <router-link to="/taskpage">
+              <div class="return">返回</div></router-link
+            >
+          </div>
+        </div>
+      </div>
+      <div class="mid">
+        <!-- <div class="item" v-for="(item, index) in mid" :key="item.id">
+          <div class="itcon">
+            <div class="img">
+              <img :src="item.img" />
+            </div>
+            <div class="text">{{ item.title }}</div>
+          </div>
+          <div :class="[index === mid.length - 1 ? 'no' : 'lin']"></div>
+        </div> -->
+        <div class="item">
+          <div class="itcon">
+            <div class="img">
+              <img src="../../assets/images/leveladd/zai.png" />
+            </div>
+            <div class="text">在线</div>
+          </div>
+          <div class="lin"></div>
+        </div>
+        <div class="item">
+          <div class="itcon">
+            <div class="img">
+              <img src="../../assets/images/leveladd/mian.png" />
+            </div>
+            <div class="text">面授</div>
+          </div>
+          <div class="lin"></div>
+        </div>
+        <div class="item">
+          <div class="itcon">
+            <div class="img">
+              <img src="../../assets/images/leveladd/an.png" />
+            </div>
+            <div class="text">案例</div>
+          </div>
+          <div class="lin"></div>
+        </div>
+        <div class="item">
+          <div class="itcon">
+            <div class="img">
+              <img src="../../assets/images/leveladd/zuo.png" />
+            </div>
+            <div class="text">作业</div>
+          </div>
+          <div class="lin"></div>
+        </div>
+        <div class="item">
+          <div class="itcon">
+            <div class="img">
+              <img src="../../assets/images/leveladd/kao.png" />
+            </div>
+            <div class="text">考试</div>
+          </div>
+          <div class="lin"></div>
+        </div>
+        <div class="item">
+          <div class="itcon">
+            <div class="img">
+              <img src="../../assets/images/leveladd/zhi.png" />
+            </div>
+            <div class="text">直播</div>
+          </div>
+          <div class="lin"></div>
+        </div>
+        <div class="item">
+          <div class="itcon">
+            <div class="img">
+              <img src="../../assets/images/leveladd/wai.png" />
+            </div>
+            <div class="text">外链</div>
+          </div>
+          <div class="lin"></div>
+        </div>
+        <div class="item">
+          <div class="itcon">
+            <div class="img">
+              <img src="../../assets/images/leveladd/tao.png" />
+            </div>
+            <div class="text">讨论</div>
+          </div>
+          <div class="lin"></div>
+        </div>
+        <div class="item">
+          <div class="itcon">
+            <div class="img">
+              <img src="../../assets/images/leveladd/huo.png" />
+            </div>
+            <div class="text">活动</div>
+          </div>
+          <div class="lin"></div>
+        </div>
+        <div class="item">
+          <div class="itcon">
+            <div class="img">
+              <img src="../../assets/images/leveladd/ce.png" />
+            </div>
+            <div class="text">测评</div>
+          </div>
+          <div class="lin"></div>
+        </div>
+        <div class="item">
+          <div class="itcon">
+            <div class="img">
+              <img src="../../assets/images/leveladd/diao.png" />
+            </div>
+            <div class="text">调研</div>
+          </div>
+          <div class="lin"></div>
+        </div>
+        <div class="item">
+          <div class="itcon">
+            <div class="img">
+              <img src="../../assets/images/leveladd/tou.png" />
+            </div>
+            <div class="text">投票</div>
+          </div>
+        </div>
+      </div>
+      <div class="boom">
+        <div class="boomcen">
+          <div class="onerow">
+                    <div class="taskmain">任务列表</div>
+                    <button class="btn">移动到任务阶段</button>
+                    <div class="edit">
+                        <img class="editimg" src="../../assets/images/projectadd/delete.png"/>
+                        <span class="editext">批量删除</span>
+                    </div>
+                </div>
+          <div class="talk">
+            <img class="im" src="../../assets/images/leveladd/gan.png" />
+            <div class="xu">
+              <span class="yi">已选择</span>
+              <div style="width: 5px; display: inline-block"></div>
+              <span class="th">3</span>
+              <div style="width: 5px; display: inline-block"></div>
+              <span class="yi">项</span>
+              <span class="zon">人物总数：</span>
+              <span class="yi">5</span>
+              <span class="yi">条</span>
+            </div>
+          </div>
+          <div class="tableBox">
+            <a-table
+              style="border: 1px solid #f2f6fe"
+              :columns="tableDataFunc()"
+              :data-source="tableData"
+              :loading="tableDataTotal === -1 ? true : false"
+              expandRowByClick="true"
+              :scroll="{ x: 1500, y: 300 }"
+              @expand="expandTable"
+              :pagination="false"
+            />
+            <!-- :pagination= showSizeChanger: true, showQuickJumper: true,
+      hideOnSinglePage: true, pageSizeOptions: [], pageSize: pageSize, current:
+      currentPage, total: tableDataTotal, -->
+            <div class="pa">
+              <a-pagination
+                showSizeChanger="true"
+                showQuickJumper="true"
+                hideOnSinglePage="true"
+                :pageSize="pageSize"
+                :current="currentPage"
+                :total="tableDataTotal"
+                class="pagination"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="draw" style="position: relative">
+        <a-drawer
+          v-model:visible="visible"
+          class="drawerStyle"
+          title="关联项目"
+          placement="right"
+          width="50%"
+          @after-visible-change="afterVisibleChange"
+        >
+          <div class="drawerMain">
+            <div class="header">
+              <div class="headerTitle">关联项目</div>
+              <img
+                style="width: 29px; height: 29px; cursor: pointer"
+                src="../../assets/images/basicinfo/close.png"
+                @click="showDrawer"
+              />
+            </div>
+            <div class="drawerbox">
+              <a-table
+                :columns="drawercolumns"
+                :data-source="drawertableData"
+                :loading="tableDataTotal === -1 ? true : false"
+                :scroll="{ x: 700 }"
+                @expand="expandTable"
+                :pagination="false"
+              >
+              </a-table>
+            </div>
+            <div class="btnn">
+              <button @click="showDrawer" class="btn1">取消</button>
+              <button @click="showDrawer" class="btn2">确定</button>
+            </div>
+          </div>
+        </a-drawer>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { reactive, toRefs } from "vue";
+const drawercolumns = [
+  {
+    title: "项目名称",
+    dataIndex: "projectName",
+    key: "projectName",
+    width: 200,
+    // align: "center",
+    ellipsis: true,
+    // scopedSlots: { customRender: "action" }, //引入的插槽
+    // customRender: (text, record) => {
+    //   console.log(text, record);
+    //   return <span>{text.text}</span>;
+    // },
+  },
+  {
+    title: "项目经理",
+    dataIndex: "manager",
+    key: "manager",
+    width: 100,
+    align: "center",
+  },
+
+  {
+    title: "创建人",
+    dataIndex: "creater",
+    // width: "30%",
+    key: "creater",
+    width: 100,
+    align: "center",
+  },
+  {
+    title: "创建时间",
+    dataIndex: "time",
+    key: "time",
+    width: 180,
+    align: "center",
+  },
+];
+export default {
+  name: "LevelAddDetail",
+  setup() {
+    const state = reactive({
+      projectNameList: [
+        {
+          id: 1,
+          value: "项目一",
+          label: "项目一",
+        },
+        {
+          id: 2,
+          value: "项目二",
+          label: "项目二",
+        },
+        {
+          id: 3,
+          value: "项目三",
+          label: "项目三",
+        },
+        {
+          id: 4,
+          value: "项目四",
+          label: "项目四",
+        },
+      ],
+      projectNameList2: [
+        {
+          id: 1,
+          value: "批量操作",
+          label: "批量操作",
+        },
+        {
+          id: 2,
+          value: "删除任务",
+          label: "删除任务",
+        },
+        {
+          id: 3,
+          value: "移动任务到关卡",
+          label: "移动任务到关卡",
+        },
+      ],
+      level: [
+        {
+          id: "1",
+          tit: "阶段1",
+          name: "腾飞班1基础",
+        },
+        {
+          id: "2",
+          tit: "阶段2",
+          name: "腾飞班1基础",
+        },
+      ],
+      tableData: [
+        {
+          key: 1,
+          lei: "在线",
+          // state: "已发布",
+          creater: "管理者课程",
+          // pubtime: "2022-07-20 14:00:03",
+          cretime: "60分钟",
+          haspub: false,
+          checked1: false,
+          checkedd: false,
+        },
+        {
+          key: 2,
+          lei: "面授",
+          // state: "草稿",
+          creater: "管理者面授",
+          // pubtime: "2022-07-20 14:00:03",
+          cretime: "20分钟",
+          haspub: true,
+          checked1: false,
+          checkedd: false,
+        },
+        {
+          key: 3,
+          lei: "作业",
+          // state: "已停用",
+          creater: "管理者作业",
+          // pubtime: "2022-07-20 14:00:03",
+          cretime: "60分钟",
+          haspub: false,
+          checked1: false,
+          checkedd: false,
+        },
+        {
+          key: 4,
+          lei: "考试",
+          // state: "草稿",
+          creater: "管理者考试",
+          // pubtime: "2022-07-20 14:00:03",
+          cretime: "20分钟",
+          haspub: true,
+          checked1: false,
+          checkedd: false,
+        },
+        {
+          key: 5,
+          lei: "案例",
+          // state: "草稿",
+          creater: "腾飞班1案例",
+          // pubtime: "2022-07-20 14:00:03",
+          cretime: "-",
+          haspub: true,
+          checked1: true,
+          checkedd: false,
+        },
+      ],
+      drawertableData: [
+        {
+          key: 1,
+          projectName: "管理者进阶",
+          manager: "黄华  刘俊",
+          creater: "毛继禹",
+          time: "2022-07-20 14:00:03",
+          children: [
+            {
+              key: "1-1",
+              projectName: "管理者进阶-腾飞班",
+              manager: "黄华  刘俊",
+
+              creater: "毛继禹",
+              time: "2022-07-20 14:00:03",
+              children: [
+                {
+                  key: "1-1-1",
+                  projectName: "管理者进阶-腾飞班K1",
+                  manager: "黄华  刘俊",
+                  creater: "毛继禹",
+                  time: "2022-07-20 14:00:03",
+                },
+              ],
+            },
+          ],
+        },
+        {
+          key: 2,
+          projectName: "管理者进阶",
+          manager: "黄华  刘俊",
+          creater: "毛继禹",
+          time: "2022-07-20 14:00:03",
+          children: [
+            {
+              key: "2-1",
+              projectName: "管理者进阶-腾飞班",
+              manager: "黄华  刘俊",
+
+              creater: "毛继禹",
+              time: "2022-07-20 14:00:03",
+              children: [
+                {
+                  key: "2-1-1",
+                  projectName: "管理者进阶-腾飞班K1",
+                  manager: "黄华  刘俊",
+                  creater: "毛继禹",
+                  time: "2022-07-20 14:00:03",
+                },
+              ],
+            },
+          ],
+        },
+
+        {
+          key: 3,
+          projectName: "管理者进阶-腾飞班K1",
+          manager: "黄华  刘俊",
+
+          creater: "毛继禹",
+          time: "2022-07-20 14:00:03",
+        },
+        {
+          key: 4,
+          projectName: "管理者进阶-腾飞班K1",
+          manager: "黄华  刘俊",
+
+          creater: "毛继禹",
+          time: "2022-07-20 14:00:03",
+        },
+        {
+          key: 5,
+          projectName: "管理者进阶-腾飞班K1",
+          manager: "黄华  刘俊",
+
+          creater: "毛继禹",
+          time: "2022-07-20 14:00:03",
+        },
+        {
+          key: 6,
+          projectName: "管理者进阶-腾飞班K1",
+          manager: "黄华  刘俊",
+
+          creater: "毛继禹",
+          time: "2022-07-20 14:00:03",
+        },
+        {
+          key: 7,
+          projectName: "管理者进阶-腾飞班K1",
+          manager: "黄华  刘俊",
+
+          creater: "毛继禹",
+          time: "2022-07-20 14:00:03",
+        },
+      ],
+      currentPage: 1,
+      tableDataTotal: 100,
+      pageSize: 10,
+      visible: false,
+    });
+    const selectProjectName = (value, index) => {
+      console.log("value", value, index);
+    };
+    const selectProjectName2 = (value, index) => {
+      console.log("value", value, index);
+    };
+    const showDrawer = () => {
+      state.visible = !state.visible;
+    };
+    const afterVisibleChange = (bool) => {
+      console.log("visible", bool);
+    };
+    const tableDataFunc = () => {
+      const columns = [
+        {
+          title: "类型",
+          dataIndex: "state",
+          // width: "30%",
+          key: "state",
+          width: 90,
+          align: "center",
+          className: "h",
+          scopedSlots: { customRender: "action" }, //引入的插槽
+          customRender: (text) => {
+            console.log(text.record.checked1);
+            return (
+              <div class="racona">
+                <div class="img"></div>
+                <a-checkbox class="ch" v-model:checked={text.record.checkedd}>
+                  {text.record.lei}
+                </a-checkbox>
+              </div>
+            );
+          },
+        },
+        {
+          title: "任务名称",
+          dataIndex: "creater",
+          // width: "30%",
+          key: "creater",
+          width: 200,
+          align: "center",
+          className: "h",
+        },
+        {
+          title: "必修/选修",
+          dataIndex: "pubtime",
+          key: "pubtime",
+          width: 200,
+          align: "center",
+          className: "h",
+          scopedSlots: { customRender: "action" }, //引入的插槽
+          customRender: (text) => {
+            console.log(text.record.checked1);
+            return (
+              <div class="opat">
+                <div class="opacationt clearfix">
+                  <a-switch
+                    style="margin-left:-50px;margin-top:3px"
+                    v-model:checked={text.record.checked1}
+                    size="small"
+                    active-color="red"
+                  />
+                  <div class="showt clearfix">
+                    <div
+                      class="bi"
+                      style={
+                        text.record.checked1 ? "z-index:999" : "z-index:998"
+                      }
+                    >
+                      必修
+                    </div>
+                    <div class="xuan">选修</div>
+                  </div>
+                </div>
+              </div>
+            );
+          },
+        },
+        {
+          title: "时长",
+          dataIndex: "cretime",
+          key: "cretime",
+          width: 100,
+          align: "center",
+          className: "h",
+        },
+        {
+          title: "操作",
+          className: "h",
+          dataIndex: "opacation",
+          key: "opacation",
+          width: 100,
+          align: "center",
+          scopedSlots: { customRender: "action" }, //引入的插槽
+          customRender: () => {
+            return (
+              <div class="opa">
+                <div class="opacation">
+                  <span style="color:#4EA6FF;margin-right:25px;cursor:pointer">
+                    编辑
+                  </span>
+                  <span style="color:#4EA6FF;cursor:pointer">删除</span>
+                </div>
+              </div>
+            );
+          },
+        },
+      ];
+      return columns;
+    };
+
+    return {
+      ...toRefs(state),
+      selectProjectName,
+      selectProjectName2,
+      tableDataFunc,
+      showDrawer,
+      afterVisibleChange,
+      drawercolumns,
+    };
+  },
+};
+</script>
+
+<style  lang="scss" >
+.clearfix:after,
+.clearfix:before {
+  content: " ";
+  display: block;
+  clear: both;
+}
+
+.drawerStyle {
+  .ant-drawer-content-wrapper {
+    max-width: 1000px;
+    .ant-drawer-header {
+      display: none !important;
+    }
+    .ant-drawer-body {
+      padding: 0;
+    }
+  }
+  .drawerMain {
+    min-width: 600px;
+    margin: 0px 32px 0px 32px;
+    overflow-x: scroll;
+    display: flex;
+    flex-direction: column;
+    .header {
+      height: 73px;
+      border-bottom: 1px solid #e8e8e8;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      // background-color: red;
+      margin-bottom: 20px;
+      .headerTitle {
+        font-size: 18px;
+        font-weight: 600;
+        color: #333333;
+        line-height: 25px;
+        // margin-left: 24px;
+      }
+    }
+    .drawerbox {
+      margin: 20px 38px 30px;
+      th {
+        background-color: #eff4fc !important;
+      }
+
+      .ant-table-tbody
+        > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
+        > td {
+        background: #f6f9fd;
+      }
+    }
+    .btnn {
+      height: 72px;
+      width: 100%;
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.16);
+      .btn1 {
+        width: 100px;
+        height: 40px;
+        border: 1px solid #4ea6ff;
+        border-radius: 8px;
+        color: #4ea6ff;
+        background-color: #fff;
+        cursor: pointer;
+      }
+      .btn2 {
+        cursor: pointer;
+        width: 100px;
+        height: 40px;
+        background: #4ea6ff;
+        border-radius: 8px;
+        border: 0;
+        margin-left: 15px;
+        color: #fff;
+      }
+    }
+  }
+}
+.allCon {
+  width: 100%;
+  height: 100%;
+  background-color: #f1f4f8;
+  display: flex;
+  .left {
+    margin-right: 20px;
+    width: 208px;
+    flex-shrink: 0;
+    height: 100%;
+    background: #ffffff;
+    box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
+    display: flex;
+    justify-content: center;
+    .leftmain {
+      width: 86%;
+      margin-top: 20px;
+      .tit {
+        font-size: 18px;
+        color: #363636;
+      }
+
+      // flex-wrap: wrap;
+      .btn {
+        margin-top: 20px;
+        // padding: 0px 26px 0px 26px;
+        height: 38px;
+        background: #fff6e8;
+        border-radius: 8px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        // margin-right: 14px;
+        flex-shrink: 0;
+        cursor: pointer;
+        .search {
+          background-size: 100%;
+        }
+        .btnText {
+          font-size: 14px;
+          font-weight: 400;
+          color: #ffb64e;
+          // line-height: 38px;
+          margin-top: 4px;
+          margin-left: 5px;
+        }
+      }
+
+      .btn3 {
+        margin-right: 0px;
+        .search {
+          width: 17px;
+          height: 18px;
+          background-image: url("../../assets/images/leveladd/add.png");
+          background-size: 100% 100%;
+        }
+      }
+      .maincon {
+        margin-top: 17px;
+        width: 100%;
+        // background-color: #bfa;
+        .item {
+          width: 100%;
+          height: 83px;
+          display: flex;
+          background: rgba(255, 182, 78, 0.1);
+          border: 1px solid #ffb64e;
+          opacity: 0.45;
+          border-radius: 8px;
+          margin-bottom: 17px;
+          align-items: center;
+          position: relative;
+          .itemle {
+            margin-left: 17px;
+            .tit {
+              color: black;
+              // color: red;
+              font-size: 14px;
+              margin-bottom: 8px;
+              font-weight: bold;
+              white-space: nowrap;
+              text-overflow: ellipsis;
+              overflow: hidden;
+              width: 100px;
+            }
+            .name {
+              font-size: 14px;
+              color: #878b92;
+              white-space: nowrap;
+              text-overflow: ellipsis;
+              overflow: hidden;
+              width: 100px;
+            }
+          }
+          .itemri {
+            display: flex;
+            flex-direction: column;
+            position: absolute;
+            right: 16px;
+          }
+        }
+      }
+    }
+  }
+  .right {
+    flex: 1;
+    height: 100%;
+    width: 100%;
+    // background-color: #fff;
+    display: flex;
+    flex-direction: column;
+    .addhead {
+      width: 100%;
+      // min-width: 500px;
+      // height: 130px;
+
+      background-color: #fff;
+      box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.07);
+      display: flex;
+      align-items: center;
+      position: relative;
+      .filt {
+        margin: 16px 30px 16px 22px;
+        display: flex;
+        justify-content: space-between;
+        width: 100%;
+        align-items: center;
+        flex-wrap: wrap;
+        .le {
+          display: flex;
+          align-items: center;
+          // margin-bottom: 10px;
+          .leftimg {
+            width: 151px;
+            height: 100px;
+            border: 10px solid #e7f2ff;
+            border-radius: 8px;
+            margin-left: 20px;
+            .img {
+              width: 100%;
+              height: 100%;
+            }
+          }
+          .imgfor {
+            margin-left: 32px;
+            .forz {
+              color: #363636;
+              font-size: 16px;
+            }
+            .fort {
+              color: #878b92;
+              font-size: 14px;
+              margin-top: 20px;
+            }
+          }
+        }
+
+        .rightt {
+          // width: 500px;
+          height: 100%;
+          // background-color: red;
+          // position: absolute;
+          // right: 0;
+          display: flex;
+          align-items: center;
+          .select {
+            margin-right: 50px;
+            // margin-bottom: 20px;
+          }
+          .line {
+            height: 60px;
+            width: 1px;
+            background-color: #e8effa;
+            margin-right: 28px;
+          }
+          .img2 {
+            width: 42px;
+            height: 42px;
+            margin-right: 22px;
+          }
+          .pub {
+            color: #57C887;
+            font-size: 14px;
+            margin-top: 5px;
+            margin-right: 30px;
+          }
+          .return {
+            color: #4ea6ff;
+            font-size: 14px;
+            margin-top: 5px;
+            margin-right: 20px;
+          }
+
+          .role {
+            display: flex;
+            align-items: center;
+            font-size: 16px;
+            font-weight: 400;
+            color: #333330;
+            line-height: 36px;
+            cursor: pointer;
+            position: relative;
+            margin-right: 20px;
+            .roleArrow {
+              width: 13px;
+              height: 7px;
+              margin-left: 8px;
+              background-image: url(../../assets/images/navtop/down.png);
+              background-size: 100%;
+            }
+            .roleItems {
+              width: 109px;
+              height: 90px;
+              padding-top: 10px;
+              background: #ffffff;
+              box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
+              position: absolute;
+              top: 35px;
+              right: 0px;
+              text-align: center;
+              display: none;
+              z-index: 100;
+            }
+            .roleItem {
+              font-size: 14px;
+              font-weight: 400;
+              color: rgba(79, 81, 86, 1);
+              line-height: 36px;
+            }
+            .roleItem:hover {
+              color: #4ea6ff;
+            }
+          }
+          .role:hover .roleItems {
+            display: block;
+          }
+          .role:hover .roleArrow {
+            background-image: url(../../assets/images/navtop/up.png);
+          }
+        }
+      }
+    }
+
+    .mid {
+      width: 100%;
+      height: 130px;
+      margin-top: 20px;
+      margin-bottom: 20px;
+      background-color: #fff;
+      box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.07);
+      display: flex;
+      align-items: center;
+      .item {
+        height: 100%;
+        width: 7.7%;
+        display: flex;
+        align-items: center;
+        .itcon {
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          justify-content: center;
+          height: 100%;
+          width: 100%;
+          .img {
+            cursor: pointer;
+          }
+          .text {
+            font-size: 16px;
+            color: #363636;
+            margin-top: 5px;
+          }
+        }
+        .lin {
+          width: 1px;
+          height: 60%;
+          background-color: #e8effa;
+        }
+        .no {
+          display: none;
+        }
+      }
+    }
+    .boom {
+      position: relative;
+      width: 100%;
+      flex: 1;
+      background-color: #fff;
+      box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.07);
+      display: flex;
+      justify-content: center;
+      .boomcen {
+        width: 95%;
+        height: 100%;
+        // background-color: #bfa;
+        .onerow {
+            width: 100%;
+            display: flex;
+            height: 40px;
+            position: relative;
+            margin-top: 20px;
+            .taskmain {
+                font-size: 18px;
+                color: #000000;
+            }
+            .btn {
+                position: absolute;
+                top: 0;
+                right: 130px;
+                background-color: #409EFF;
+                width: 130px;
+                height: 40px;
+                border-radius: 8px;
+                border: 1px solid #409EFF;
+                color: #FFFFFF;
+                cursor: pointer;
+            }
+            .edit {
+                position: absolute;
+                right: 0;
+                top: 0;
+                color: #409EFF;
+                width: 120px;
+                height: 40px;
+                border: 1px solid #409EFF;
+                border-radius: 8px;
+                .editimg {
+                    width: 15px;
+                    height: 15px;
+                    margin-top: -2px;
+                    margin-left: 25px;
+                    margin-right: 5px;
+                } 
+                .editext {
+                    line-height: 40px;
+                }               
+            }
+            .edit:hover {
+                color: #FFFFFF;
+                background-color: #409EFF;
+                cursor: pointer;
+                .editimg {
+                    background-image: url("../../assets/images/projectadd/delete1.png");
+                }
+            }
+        }
+        .talk {
+          margin-top: 24px;
+          margin-bottom: 11px;
+          width: 100%;
+          height: 50px;
+          background: #f5faff;
+          border: 1px solid #4ea6ff;
+          // opacity: 0.22;
+          display: flex;
+          align-items: center;
+          .im {
+            width: 14px;
+            height: 15px;
+            margin-left: 27px;
+          }
+          .xu {
+            height: 100%;
+            line-height: 50px;
+            margin-left: 13px;
+            .yi {
+              color: #4f5156;
+              font-size: 14px;
+            }
+            .zon {
+              color: #999ba3;
+              font-size: 14px;
+              margin-left: 34px;
+            }
+            .th {
+              color: #4ea6ff;
+            }
+          }
+        }
+        .tableBox {
+          // margin: 20px 38px 30px;
+          th.h {
+            background-color: #eff4fc !important;
+          }
+
+          .ant-table-tbody
+            > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
+            > td {
+            background: #f6f9fd;
+          }
+          .pa {
+            left: 0;
+            width: 100%;
+            // height: 20px;
+            // background-color: red;
+            display: flex;
+            justify-content: center;
+            position: absolute;
+            bottom: 20px;
+          }
+        }
+      }
+    }
+    // .drawerbox {
+    //   // margin: 20px 38px 30px;
+    //   th.h {
+    //     background-color: #eff4fc !important;
+    //   }
+
+    //   .ant-table-tbody
+    //     > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
+    //     > td {
+    //     background: #f6f9fd;
+    //   }
+    // }
+    .draw {
+      .drawerbox {
+      }
+    }
+  }
+
+  .opat {
+    .opacationt {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      .ant-switch-checked {
+        background-color: #5dc988;
+      }
+      .showt {
+        // margin-top: 10px;
+        display: flex;
+        margin-left: 10px;
+        height: 23px;
+        .bi {
+          // margin-top: 10px;
+          width: 63px;
+          height: 23;
+          background-color: #5dc988;
+          line-height: 23px;
+          position: absolute;
+          z-index: 998;
+          color: #ffffff;
+          border-radius: 4px;
+        }
+        .xuan {
+          width: 63px;
+          height: 23px;
+          background-color: #f2f6fc;
+          line-height: 23px;
+          // display: none;
+          position: absolute;
+          z-index: 998;
+          color: #5dc988;
+          border-radius: 4px;
+        }
+      }
+    }
+  }
+  .racona {
+    // background-color: #bfa;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+    .img {
+      margin-left: -40px;
+      margin-top: -2px;
+      width: 17px;
+      height: 14px;
+      background-image: url("../../assets/images/leveladd/z1.png");
+    }
+    .ch {
+      margin-left: 10px;
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/projectcenter/TaskPage.vue b/src/views/projectcenter/TaskPage.vue
index d982d1ef..79f87126 100644
--- a/src/views/projectcenter/TaskPage.vue
+++ b/src/views/projectcenter/TaskPage.vue
@@ -5,29 +5,488 @@
         <div class="box">
             <img src="../../assets/images/projectadd/picture.png"/>
         </div>
+        <div class="imgfor">
+            <div class="forz">管理者进阶-腾飞班</div>
+            <div class="fort">项目经理：黄华/刘俊</div>
+            <div class="fort">起止时间：2022-07-21 00:00至2020-10-21 00:00</div>
+        </div>
+        <div class="right">
+            <div class="end">
+                <div style="margin-top: 20px;margin-left: 10px">
+                    <img class="endimg" src="../../assets/images/projectadd/ending.png"/>
+                    <span class="endtext">结束项目</span>
+                </div>             
+            </div>
+            <div class="end">
+                <div style="margin-top: 20px;margin-left: 10px">
+                    <img class="endimg" src="../../assets/images/leveladd/more.png"/>
+                    <div class="tableSelect" style="margin-left: 10px;margin-right: 20px">
+                  <a-select
+                    style="width: 50px; color: #7096E3"
+                    value="更多"
+                    dropdownClassName="tabledropdown"
+                  >
+                    <a-select-option value="撤回" label="撤回">
+                      <div>撤回</div>
+                    </a-select-option>
+                    <a-select-option value="复制" label="复制">
+                      <div>复制</div>
+                    </a-select-option>
+                    <a-select-option value="存为模板" label="存为模板">
+                      <div>存为模板</div>
+                    </a-select-option>
+                  </a-select>
+                </div>
+                </div>
+            </div>
+            <div class="end">
+                 <div style="margin-top: 20px;margin-left: 10px;margin-right:30px">
+                    <img class="ending" src="../../assets/images/leveladd/back.png" />
+                    <span class="endtext" style="color:#4EA6FF">返回</span>
+                </div>
+            </div>
+        </div>
     </div>
     <div class="split"></div>
-    <div>2</div>
+    <div class="content">
+        <a-tabs class="tab"
+            v-model:activeKey="activeKey"
+            size="large"
+            :tabBarStyle="{ marginLeft: '10px' }">
+            <a-tab-pane key="1" tab="概览">Content of Tab Pane 1</a-tab-pane>
+            <a-tab-pane key="2" tab="任务" force-render>
+                <div class="onerow">
+                    <div class="taskmain">任务大纲</div>
+                    <button class="btn">批量面授报名</button>
+                    <div class="edit">
+                        <img class="editimg" src="../../assets/images/projectadd/edit.png"/>
+                        <span class="editext">编辑</span>
+                    </div>
+                </div>
+                <div class="stage">
+                    <span class="stageimg"><img src="../../assets/images/projectadd/close.png"/></span>
+                    <span class="stagename">阶段1腾飞班阶级1</span>
+                </div>
+                <div class="course">
+                    <div class="first">
+                        <div class="icon"><img src="../../assets/images/leveladd/zai.png"/></div>
+                        <div>
+                            <div class="iconame">「在线」</div>
+                            <div class="icontext">时间管理</div>
+                        </div>
+                    </div>
+                    <div class="type">
+                        <div class="typename">选修</div>
+                    </div>
+                    <div class="time">
+                        <div class="timetext">开始时间</div>
+                        <div class="timetext">2022-09-16 14:03</div>
+                    </div>
+                    <div class="progress">
+                        <div class="progresstext">25/50人</div>
+                        <div style="display: flex">
+                            <a-progress :showInfo="false" :percent="50" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
+                            <span class="progresstext" style="margin-left: 10px">50%</span>
+                        </div>
+                    </div>
+                    <div class="operations">
+                       
+                        <div class="operation">管理</div>
+                        
+                    </div>
+                </div>
+                <div class="course">
+                    <div class="first">
+                        <div class="icon"><img src="../../assets/images/leveladd/zhi.png"/></div>
+                        <div>
+                            <div class="iconame">「直播」</div>
+                            <div class="icontext">管理直播间</div>
+                        </div>
+                    </div>
+                    <div class="type">
+                        <div class="typename1">必修</div>
+                    </div>
+                    <div class="time">
+                        <div class="timetext">开始时间</div>
+                        <div class="timetext">2022-09-16 14:03</div>
+                    </div>
+                    <div class="progress">
+                        <div class="progresstext">0/50人</div>
+                        <div style="display: flex">
+                            <a-progress :showInfo="false" :percent="0" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
+                            <span class="progresstext" style="margin-left: 10px">0%</span>
+                        </div>
+                    </div>
+                    <div class="operations">
+                        <div class="operation">考勤</div>
+                        <div class="operation">管理</div>
+                        <div class="operation">二维码</div>
+                    </div>
+                </div>
+                <div class="course">
+                    <div class="first">
+                        <div class="icon"><img src="../../assets/images/leveladd/mian.png"/></div>
+                        <div>
+                            <div class="iconame">「面授」</div>
+                            <div class="icontext">管理面授课</div>
+                        </div>
+                    </div>
+                    <div class="type">
+                        <div class="typename">选修</div>
+                    </div>
+                    <div class="time">
+                        <div class="timetext">开始时间</div>
+                        <div class="timetext">2022-09-16 14:03</div>
+                    </div>
+                    <div class="progress">
+                        <div class="progresstext">0/50人</div>
+                        <div style="display: flex">
+                            <a-progress :showInfo="false" :percent="0" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
+                            <span class="progresstext" style="margin-left: 10px">0%</span>
+                        </div>
+                    </div>
+                    <div class="operations">
+                        <div class="operation">学员</div>
+                        <div class="operation">管理</div>
+                        <div class="operation">二维码</div>
+                    </div>
+                </div>
+                <div class="course">
+                    <div class="first">
+                        <div class="icon"><img src="../../assets/images/leveladd/huo.png"/></div>
+                        <div>
+                            <div class="iconame">「活动」</div>
+                            <div class="icontext">管理活动</div>
+                        </div>
+                    </div>
+                    <div class="type">
+                        <div class="typename1">必修</div>
+                    </div>
+                    <div class="time">
+                        <div class="timetext">开始时间</div>
+                        <div class="timetext">2022-09-16 14:03</div>
+                    </div>
+                    <div class="progress">
+                        <div class="progresstext">0/50人</div>
+                        <div style="display: flex">
+                            <a-progress :showInfo="false" :percent="0" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
+                            <span class="progresstext" style="margin-left: 10px">0%</span>
+                        </div>
+                    </div>
+                    <div class="operations">
+                        <div class="operation">考勤</div>
+                        <div class="operation">管理</div>
+                        <div class="operation">二维码</div>
+                    </div>
+                </div>
+                <div class="course">
+                    <div class="first">
+                        <div class="icon"><img src="../../assets/images/leveladd/zuo.png"/></div>
+                        <div>
+                            <div class="iconame">「作业」</div>
+                            <div class="icontext">管理者作业</div>
+                        </div>
+                    </div>
+                    <div class="type">
+                        <div class="typename">选修</div>
+                    </div>
+                    <div class="time">
+                        <div class="timetext">开始时间</div>
+                        <div class="timetext">2022-09-16 14:03</div>
+                    </div>
+                    <div class="progress">
+                        <div class="progresstext">0/50人</div>
+                        <div style="display: flex">
+                            <a-progress :showInfo="false" :percent="0" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
+                            <span class="progresstext" style="margin-left: 10px">0%</span>
+                        </div>
+                    </div>
+                    <div class="operations">
+                        
+                        <div class="operation">管理</div>
+                        
+                    </div>
+                </div>
+                <div class="course">
+                    <div class="first">
+                        <div class="icon"><img src="../../assets/images/leveladd/kao.png"/></div>
+                        <div>
+                            <div class="iconame">「考试」</div>
+                            <div class="icontext">管理者考试</div>
+                        </div>
+                    </div>
+                    <div class="type">
+                        <div class="typename">选修</div>
+                    </div>
+                    <div class="time">
+                        <div class="timetext">开始时间</div>
+                        <div class="timetext">2022-09-16 14:03</div>
+                    </div>
+                    <div class="progress">
+                        <div class="progresstext">0/50人</div>
+                        <div style="display: flex">
+                            <a-progress :showInfo="false" :percent="0" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
+                            <span class="progresstext" style="margin-left: 10px">0%</span>
+                        </div>
+                    </div>
+                    <div class="operations">
+                        
+                        <div class="operation">管理</div>
+                        
+                    </div>
+                </div>
+                <div class="stage" style="margin-top: 0">
+                    <span class="stageimg"><img src="../../assets/images/projectadd/close.png"/></span>
+                    <span class="stagename">阶段2 腾飞班阶级2</span>
+                </div>
+                <div style="display: flex; height: 20px"></div>
+            </a-tab-pane>
+            <a-tab-pane key="3" tab="学员">Content of Tab Pane 3</a-tab-pane>
+            <a-tab-pane key="4" tab="公告">Content of Tab Pane 3</a-tab-pane>
+            <a-tab-pane key="5" tab="项目积分">Content of Tab Pane 3</a-tab-pane>
+            <a-tab-pane key="6" tab="排行榜">Content of Tab Pane 3</a-tab-pane>
+            <a-tab-pane key="7" tab="设置">Content of Tab Pane 3</a-tab-pane>
+        </a-tabs>
+    </div>
 </div>
 </template>
+<script lang="ts">
+</script>
 <style lang="scss">
 .taskpage {
     width: 100%;
     display: flex;
     flex-direction: column;
+    //position: relative;
     .header {
         width: 100%;
         display: flex;
+        flex-wrap: wrap;
         .box {
             border: 12px solid #E7F2FF;
             margin: 16px 0 16px 19px;
             border-radius: 8px;
+            //float: left;
+        }
+        .imgfor {
+            display: flex;
+            flex: 1;
+            flex-direction: column;
+            margin-top: 38px;
+            margin-left: 15px;
+            //float: left;
+            //position: absolute;
+            //left: 210px;
+            .forz {
+                font-size: 16px;
+                color: #363636;
+                font-weight: 500;
+            }
+            .fort {
+                font-size: 14px;
+                color: #878B92;
+
+            }
+        }
+        .right {
+            display: flex;
+            //position: absolute;
+            //right: 10px;
+            //top: 5px;
+            //float: right;
+            .end {
+                border-left: 1px solid #E8EFFA;
+                height: 82px;
+                margin-top:30px;
+                //width: 113px;
+                .endimg {
+                    width: 42px;
+                    height: 42px;
+                    
+                }
+                .endtext {
+                    font-size: 14px;
+                    color: #57C887;
+                    padding: 7px;
+                }
+                
+            }
+        }
+    }
+    .tableBox {
+    margin: 20px 38px 30px;
+    .ant-table-thead > tr > th {
+      font-size: 14px;
+      font-weight: 400;
+      color: #999ba3;
+      line-height: 36px;
+      padding: 5px 16px;
+      background-color: #eff4fc;
+    }
+    
+    }
+        .split {
+        width: 100%;
+        height: 20px;
+        background-color: #edf0f5;
+    }
+    .content {
+        //display: flex;
+        margin: 0 37px;
+        .onerow {
+            width: 100%;
+            display: flex;
+            height: 40px;
+            position: relative;
+            //margin-top: 5xp;
+            .taskmain {
+                font-size: 18px;
+                color: #000000;
+            }
+            .btn {
+                position: absolute;
+                top: 0;
+                right: 110px;
+                background-color: #409EFF;
+                width: 130px;
+                height: 40px;
+                border-radius: 8px;
+                border: 1px solid #409EFF;
+                color: #FFFFFF;
+                cursor: pointer;
+            }
+            .edit {
+                position: absolute;
+                right: 0;
+                top: 0;
+                color: #409EFF;
+                width: 100px;
+                height: 40px;
+                border: 1px solid #409EFF;
+                border-radius: 8px;
+                .editimg {
+                    width: 15px;
+                    height: 15px;
+                    margin-top: -2px;
+                    margin-left: 25px;
+                    margin-right: 5px;
+                } 
+                .editext {
+                    line-height: 40px;
+                }               
+            }
+            .edit:hover {
+                color: #FFFFFF;
+                background-color: #409EFF;
+                cursor: pointer;
+                .editimg {
+                    background-image: url("../../assets/images/projectadd/edit1.png");
+                }
+            }
+        }
+        .stage {
+            display: flex;
+            height: 49px;
+            background-color: #EFF4FC;
+            align-items: center;
+            margin-top: 20px;
+            .stageimg {
+                margin-left: 31px;
+            }
+            .stagename {
+                color: #409EFF;
+                font-size: 16px;
+                padding-left: 9px;
+                line-height: 36px;
+            }
+        }
+        .course {
+            width: 100%;
+            display: flex;
+            flex-wrap: wrap;
+            align-items: center;
+            padding: 10px;
+            //margin: 0 12px;
+            border: 1px solid #F2F6FC;
+            .first {  
+                //position: relative; 
+                display: flex;
+                flex-grow: 1;
+                align-items: center;
+                //height: 71px;
+                margin-left: 12px;
+                margin-right: 50px;
+                .icon {
+                    //position: absolute;
+                }            
+                .iconame {
+                    //position: absolute;
+                    color: #4F5156;
+                    font-size: 16px;
+                }
+                .icontext {
+                    //positipn: absolute;
+                    color: #999BA3;
+                    font-size: 14px;
+                    margin-left: 8px;
+                    width: 83px;
+                }
+            }
+            .type {
+                //height: 71px;
+                display: flex;
+                flex-grow: 1;
+                align-items: center;
+                margin-right: 50px;
+                .typename {
+                    width: 63px;
+                    height: 23px;
+                    color: #5DC988;
+                    font-size: 14px;
+                    background-color: #F2F6FC;
+                    border-radius: 4px;
+                    text-align: center;
+                }
+                .typename1 {
+                    width: 63px;
+                    height: 23px;
+                    color: #F0F4FE;
+                    font-size: 14px;
+                    background-color: #5DC988;
+                    border-radius: 4px;
+                    text-align: center;
+                }
+            }
+            .time {
+                //height: 71px; 
+                flex-grow: 1;
+                margin-right: 50px;
+                .timetext {
+                    font-size: 14px;
+                    color: #999BA3;
+                }
+            }
+            .progress {
+                width: 168px;
+                margin-right: 50px;
+                flex-grow: 1;
+                .progresstext {
+                    color: #FFC067;
+                    font-size: 14px;
+                }
+            }
+            .operations {
+                display: flex;
+                width: 200px;
+                //flex-grow: 1;
+                .operation {
+                    color: #4EA6FF;
+                    font-size: 14px;
+                    padding: 10px;
+                    margin-left: auto;
+                }
+            }
         }
     }
-    .split {
-    width: 100%;
-    height: 20px;
-    background-color: #edf0f5;
-  }
 }
 </style>
\ No newline at end of file
diff --git a/src/views/research/ResearchAdd.vue b/src/views/research/ResearchAdd.vue
index 29dc7116..1726270e 100644
--- a/src/views/research/ResearchAdd.vue
+++ b/src/views/research/ResearchAdd.vue
@@ -278,6 +278,7 @@
         margin-bottom: 14px;
         .btn {
             display: flex;
+            margin-bottom: 20px;
             justify-content: center;
             cursor: pointer;
         }