diff --git a/src/views/projectcenter/TaskPage.vue b/src/views/projectcenter/TaskPage.vue
index 8111b6e3..ad8cbe6a 100644
--- a/src/views/projectcenter/TaskPage.vue
+++ b/src/views/projectcenter/TaskPage.vue
@@ -56,9 +56,7 @@
             <div class="second">
               <div
                 class="taskbox"
-                style="
-                  background: linear-gradient(180deg,#FEF3DD,#FFFAF0);
-                "
+                style="background: linear-gradient(180deg, #fef3dd, #fffaf0)"
               >
                 <div class="leftt">
                   <img src="../../assets/images/taskpage/left1.png" />
@@ -77,7 +75,11 @@
               <div
                 class="taskbox"
                 style="
-                  background: linear-gradient(180deg,rgba(221, 234, 255, 1),rgba(240, 248, 254, 1));
+                  background: linear-gradient(
+                    180deg,
+                    rgba(221, 234, 255, 1),
+                    rgba(240, 248, 254, 1)
+                  );
                 "
               >
                 <div class="leftt">
@@ -98,7 +100,11 @@
                 class="taskbox"
                 @click="showModal"
                 style="
-                  background: linear-gradient(180deg,rgba(229, 246, 236, 1) ,rgba(238, 249, 243, 1));
+                  background: linear-gradient(
+                    180deg,
+                    rgba(229, 246, 236, 1),
+                    rgba(238, 249, 243, 1)
+                  );
                 "
               >
                 <div class="leftt">
@@ -333,7 +339,9 @@
               </div>
             </div>
             <div class="operations">
-              <div class="operation">学员</div>
+              <div class="operation" style="cursor: pointer" @click="showFS">
+                学员
+              </div>
               <div class="operation" style="cursor: pointer" @click="showFace">
                 管理
               </div>
@@ -370,7 +378,9 @@
               </div>
             </div>
             <div class="operations">
-              <div class="operation">考勤</div>
+              <div class="operation" style="cursor: pointer" @click="showAA">
+                考勤
+              </div>
               <div class="operation">管理</div>
               <div class="operation">二维码</div>
             </div>
@@ -405,7 +415,9 @@
               </div>
             </div>
             <div class="operations">
-              <div class="operation">管理</div>
+              <div class="operation" style="cursor: pointer" @click="showWork">
+                管理
+              </div>
             </div>
           </div>
           <div class="course">
@@ -450,241 +462,357 @@
           <div style="display: flex; height: 20px"></div>
         </a-tab-pane>
         <a-tab-pane key="3" tab="学员">
-                <div class="split"></div>
-                <div class="content3">
-                    <a-tabs v-model:activeKey="activeKey1">
-                        <a-tab-pane key="8" tab="学员管理">
-                            <div class="group">
-                                <div class="groupleft">
-                                    <div style="display: flex;align-items: center;margin-right: 10px;margin-bottom: 10px">
-                                      <div class="groupname" style="width: 42px">姓名：</div>
-                                      <a-input v-model:value="value" placeholder="请输入姓名" />
-                                    </div>
-                                    <div style="display: flex;align-items: center;margin-right: 10px;margin-bottom: 10px">
-                                      <div class="groupname">小组名称：</div>
-                                      <a-input v-model:value="value" placeholder="请输入小组名称" />
-                                    </div>
-                                    <div style="display: flex;align-items: center;margin-right: 10px;margin-bottom: 10px">
-                                      <div class="groupname" style="width: 42px">部门：</div>
-                                      <a-select v-model:value="value" placeholder="请选择部门" />
-                                    </div>
-                                    <div style="display: flex;align-items: center;margin-bottom: 10px">
-                                      <div class="groupname" style="width: 42px">学员：</div>
-                                      <a-select v-model:value="value" placeholder="是否为优秀学员" :options="goodstuList"/>
-                                    </div>          
-                                </div>
-                                <div class="groupright">
-                                    <div class="btn1">
-                                        <img src="../../assets/images/courseManage/search0.png"/>
-                                        <span class="btn1text">搜索</span>
-                                    </div>
-                                    <div class="btn2">
-                                        <img src="../../assets/images/courseManage/reset1.png"/>
-                                        <span class="btn2text">重置</span>
-                                    </div>
-                                </div>                                                  
-                            </div>
-                            <div class="second2" style="margin-top: 20px">
-                                    <div class="btn1" @click="showModal2">
-                                        <img src="../../assets/images/courseManage/add0.png"/>
-                                        <span class="btn1text">添加学员</span>
-                                    </div>
-                                    <div class="btn2">
-                                        <img src="../../assets/images/courseManage/reset2.png"/>
-                                        <span class="btn2text">导入学员</span>
-                                    </div>
-                                    <div class="btn2">
-                                        <img src="../../assets/images/projectadd/delete.png"/>
-                                        <span class="btn2text">批量删除</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">2</span>
-                                <div style="width: 5px; display: inline-block"></div>
-                                <span class="yi">项</span>
-                                <span class="zon">列表选项总计：</span>
-                                <span class="yi">4</span>
-                                <span class="yi">条</span>
-                              </div>
-                              <div class="clear">清空</div>
-                            </div>
-                            <div class="tab" style="margin: 20px 32px 30px 32px">
-                              <a-table
-                                style="border: 1px solid #f2f6fe"
-                                :columns="tablecolumns"
-                                :data-source="tabledata"
-                                :loading="tableDataTotal === -1 ? true : false"
-                                expandRowByClick="true"
-                                :scroll="{ x: 1400, y: 350 }"
-                                @expand="expandTable"
-                                :pagination="false"
-                                :row-selection="{
-                                  columnWidth: 30,
-                                  selectedRowKeys: selectedRowKeys,
-                                  onChange: onSelectChange,
-                                }"
-                              />
-                              <div class="pa">
-                                <a-pagination
-                                  showSizeChanger="true"
-                                  showQuickJumper="true"
-                                  hideOnSinglePage="true"
-                                  :pageSize="pageSize"
-                                  :current="currentPage"
-                                  :total="tableDataTotal"
-                                  class="pagination"
-                                />
-                              </div>
-                            </div>
-                        </a-tab-pane>
-                        <a-tab-pane key="9" tab="小组管理" force-render>
-                            <div class="group">
-                                <div class="groupleft">
-                                    <div class="groupname">小组名称：</div>
-                                    <a-input v-model:value="value" placeholder="请输入小组名称" />
-                                </div>
-                                <div class="groupright">
-                                    <div class="btn1">
-                                        <img src="../../assets/images/courseManage/search0.png"/>
-                                        <span class="btn1text">搜索</span>
-                                    </div>
-                                    <div class="btn2">
-                                        <img src="../../assets/images/courseManage/reset1.png"/>
-                                        <span class="btn2text">重置</span>
-                                    </div>
-                                </div>                                                  
-                            </div>
-                            <div class="second2">
-                                <div class="btn1" @click="showModal2">
-                                        <img src="../../assets/images/courseManage/add0.png"/>
-                                        <span class="btn1text">创建小组</span>
-                                    </div>
-                                    <div class="btn2" @click="showSubset">
-                                        <img src="../../assets/images/courseManage/reset2.png"/>
-                                        <span class="btn2text">随机分组</span>
-                                    </div>
-                            </div>
-                            <div class="groupmain">
-                                <div class="groupbox">
-                                    <div style="width: 90%">
-                                        <div class="grouptitle">
-                                            <div class="goodgruop">好好学习小组</div>
-                                            <div class="more">
-                                                <span style="color: rgba(0, 0, 0, 0.4500); cursor: pointer">. . .</span>
-                                                <div class="moreItems">
-                                                    <div class="sammo">编辑</div>
-                                                    <div class="sammo">删除</div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <div class="leader">组长：小李</div>
-                                        <div class="grocenter">
-                                            <div class="leader1">进度</div>
-                                            <a-progress :percent="55" />
-                                        </div>
-                                        <div class="grofooter">
-                                            <div class="ftext">组员名单 ></div>
-                                            <div class="peoples">
-                                              <div class="people1"><img src="../../assets/images/taskpage/people1.png"/></div>
-                                              <div class="people2"><img src="../../assets/images/taskpage/people2.png"/></div>
-                                              <div class="people3"><img src="../../assets/images/taskpage/people3.png"/></div>
-                                              <div class="people4"><img src="../../assets/images/taskpage/people4.png"/></div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                                <div class="groupbox">
-                                    <div style="width: 90%">
-                                        <div class="grouptitle">
-                                            <div class="goodgruop">全能小组</div>
-                                            <div class="more">
-                                                <span style="color: rgba(0, 0, 0, 0.4500); cursor: pointer">. . .</span>
-                                                <div class="moreItems">
-                                                    <div class="sammo">编辑</div>
-                                                    <div class="sammo">删除</div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <div class="leader">组长：小李</div>
-                                        <div class="grocenter">
-                                            <div class="leader1">进度</div>
-                                            <a-progress :percent="55" />
-                                        </div>
-                                        <div class="grofooter">
-                                            <div class="ftext">组员名单 ></div>
-                                            <div class="peoples">
-                                              <div class="people1"><img src="../../assets/images/taskpage/people1.png"/></div>
-                                              <div class="people2"><img src="../../assets/images/taskpage/people2.png"/></div>
-                                              <div class="people3"><img src="../../assets/images/taskpage/people3.png"/></div>
-                                              <div class="people4"><img src="../../assets/images/taskpage/people4.png"/></div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                                <div class="groupbox">
-                                    <div style="width: 90%">
-                                        <div class="grouptitle">
-                                            <div class="goodgruop">宇宙第一最强小组</div>
-                                            <div class="more">
-                                                <span style="color: rgba(0, 0, 0, 0.4500); cursor: pointer">. . .</span>
-                                                <div class="moreItems">
-                                                    <div class="sammo">编辑</div>
-                                                    <div class="sammo">删除</div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <div class="leader">组长：小李</div>
-                                        <div class="grocenter">
-                                            <div class="leader1">进度</div>
-                                            <a-progress :percent="55" />
-                                        </div>
-                                        <div class="grofooter">
-                                            <div class="ftext">组员名单 ></div>
-                                            <div class="peoples">
-                                              <div class="people1"><img src="../../assets/images/taskpage/people1.png"/></div>
-                                              <div class="people2"><img src="../../assets/images/taskpage/people2.png"/></div>
-                                              <div class="people3"><img src="../../assets/images/taskpage/people3.png"/></div>
-                                              <div class="people4"><img src="../../assets/images/taskpage/people4.png"/></div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                                <div class="groupbox">
-                                    <div style="width: 90%">
-                                        <div class="grouptitle">
-                                            <div class="goodgruop">天天向上小组</div>
-                                            <div class="more">
-                                                <span style="color: rgba(0, 0, 0, 0.4500); cursor: pointer">. . .</span>
-                                                <div class="moreItems">
-                                                    <div class="sammo">编辑</div>
-                                                    <div class="sammo">删除</div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <div class="leader">组长：小李</div>
-                                        <div class="grocenter">
-                                            <div class="leader1">进度</div>
-                                            <a-progress :percent="55" />
-                                        </div>
-                                        <div class="grofooter">
-                                            <div class="ftext">组员名单 ></div>
-                                            <div class="peoples">
-                                              <div class="people1"><img src="../../assets/images/taskpage/people1.png"/></div>
-                                              <div class="people2"><img src="../../assets/images/taskpage/people2.png"/></div>
-                                              <div class="people3"><img src="../../assets/images/taskpage/people3.png"/></div>
-                                              <div class="people4"><img src="../../assets/images/taskpage/people4.png"/></div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        </a-tab-pane>
-                    </a-tabs>
+          <div class="split"></div>
+          <div class="content3">
+            <a-tabs v-model:activeKey="activeKey1">
+              <a-tab-pane key="8" tab="学员管理">
+                <div class="group">
+                  <div class="groupleft">
+                    <div
+                      style="
+                        display: flex;
+                        align-items: center;
+                        margin-right: 10px;
+                        margin-bottom: 10px;
+                      "
+                    >
+                      <div class="groupname" style="width: 42px">姓名：</div>
+                      <a-input v-model:value="value" placeholder="请输入姓名" />
+                    </div>
+                    <div
+                      style="
+                        display: flex;
+                        align-items: center;
+                        margin-right: 10px;
+                        margin-bottom: 10px;
+                      "
+                    >
+                      <div class="groupname">小组名称：</div>
+                      <a-input
+                        v-model:value="value"
+                        placeholder="请输入小组名称"
+                      />
+                    </div>
+                    <div
+                      style="
+                        display: flex;
+                        align-items: center;
+                        margin-right: 10px;
+                        margin-bottom: 10px;
+                      "
+                    >
+                      <div class="groupname" style="width: 42px">部门：</div>
+                      <a-select
+                        v-model:value="value"
+                        placeholder="请选择部门"
+                      />
+                    </div>
+                    <div
+                      style="
+                        display: flex;
+                        align-items: center;
+                        margin-bottom: 10px;
+                      "
+                    >
+                      <div class="groupname" style="width: 42px">学员：</div>
+                      <a-select
+                        v-model:value="value"
+                        placeholder="是否为优秀学员"
+                        :options="goodstuList"
+                      />
+                    </div>
+                  </div>
+                  <div class="groupright">
+                    <div class="btn1">
+                      <img src="../../assets/images/courseManage/search0.png" />
+                      <span class="btn1text">搜索</span>
+                    </div>
+                    <div class="btn2">
+                      <img src="../../assets/images/courseManage/reset1.png" />
+                      <span class="btn2text">重置</span>
+                    </div>
+                  </div>
                 </div>
+                <div class="second2" style="margin-top: 20px">
+                  <div class="btn1" @click="showModal2">
+                    <img src="../../assets/images/courseManage/add0.png" />
+                    <span class="btn1text">添加学员</span>
+                  </div>
+                  <div class="btn2">
+                    <img src="../../assets/images/courseManage/reset2.png" />
+                    <span class="btn2text">导入学员</span>
+                  </div>
+                  <div class="btn2">
+                    <img src="../../assets/images/projectadd/delete.png" />
+                    <span class="btn2text">批量删除</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">2</span>
+                    <div style="width: 5px; display: inline-block"></div>
+                    <span class="yi">项</span>
+                    <span class="zon">列表选项总计：</span>
+                    <span class="yi">4</span>
+                    <span class="yi">条</span>
+                  </div>
+                  <div class="clear">清空</div>
+                </div>
+                <div class="tab" style="margin: 20px 32px 30px 32px">
+                  <a-table
+                    style="border: 1px solid #f2f6fe"
+                    :columns="tablecolumns"
+                    :data-source="tabledata"
+                    :loading="tableDataTotal === -1 ? true : false"
+                    expandRowByClick="true"
+                    :scroll="{ x: 1400, y: 350 }"
+                    @expand="expandTable"
+                    :pagination="false"
+                    :row-selection="{
+                      columnWidth: 30,
+                      selectedRowKeys: selectedRowKeys,
+                      onChange: onSelectChange,
+                    }"
+                  />
+                  <div class="pa">
+                    <a-pagination
+                      showSizeChanger="true"
+                      showQuickJumper="true"
+                      hideOnSinglePage="true"
+                      :pageSize="pageSize"
+                      :current="currentPage"
+                      :total="tableDataTotal"
+                      class="pagination"
+                    />
+                  </div>
+                </div>
+              </a-tab-pane>
+              <a-tab-pane key="9" tab="小组管理" force-render>
+                <div class="group">
+                  <div class="groupleft">
+                    <div class="groupname">小组名称：</div>
+                    <a-input
+                      v-model:value="value"
+                      placeholder="请输入小组名称"
+                    />
+                  </div>
+                  <div class="groupright">
+                    <div class="btn1">
+                      <img src="../../assets/images/courseManage/search0.png" />
+                      <span class="btn1text">搜索</span>
+                    </div>
+                    <div class="btn2">
+                      <img src="../../assets/images/courseManage/reset1.png" />
+                      <span class="btn2text">重置</span>
+                    </div>
+                  </div>
+                </div>
+                <div class="second2">
+                  <div class="btn1" @click="showModal2">
+                    <img src="../../assets/images/courseManage/add0.png" />
+                    <span class="btn1text">创建小组</span>
+                  </div>
+                  <div class="btn2" @click="showSubset">
+                    <img src="../../assets/images/courseManage/reset2.png" />
+                    <span class="btn2text">随机分组</span>
+                  </div>
+                </div>
+                <div class="groupmain">
+                  <div class="groupbox">
+                    <div style="width: 90%">
+                      <div class="grouptitle">
+                        <div class="goodgruop">好好学习小组</div>
+                        <div class="more">
+                          <span
+                            style="color: rgba(0, 0, 0, 0.45); cursor: pointer"
+                            >. . .</span
+                          >
+                          <div class="moreItems">
+                            <div class="sammo">编辑</div>
+                            <div class="sammo">删除</div>
+                          </div>
+                        </div>
+                      </div>
+                      <div class="leader">组长：小李</div>
+                      <div class="grocenter">
+                        <div class="leader1">进度</div>
+                        <a-progress :percent="55" />
+                      </div>
+                      <div class="grofooter">
+                        <div class="ftext">组员名单 ></div>
+                        <div class="peoples">
+                          <div class="people1">
+                            <img
+                              src="../../assets/images/taskpage/people1.png"
+                            />
+                          </div>
+                          <div class="people2">
+                            <img
+                              src="../../assets/images/taskpage/people2.png"
+                            />
+                          </div>
+                          <div class="people3">
+                            <img
+                              src="../../assets/images/taskpage/people3.png"
+                            />
+                          </div>
+                          <div class="people4">
+                            <img
+                              src="../../assets/images/taskpage/people4.png"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="groupbox">
+                    <div style="width: 90%">
+                      <div class="grouptitle">
+                        <div class="goodgruop">全能小组</div>
+                        <div class="more">
+                          <span
+                            style="color: rgba(0, 0, 0, 0.45); cursor: pointer"
+                            >. . .</span
+                          >
+                          <div class="moreItems">
+                            <div class="sammo">编辑</div>
+                            <div class="sammo">删除</div>
+                          </div>
+                        </div>
+                      </div>
+                      <div class="leader">组长：小李</div>
+                      <div class="grocenter">
+                        <div class="leader1">进度</div>
+                        <a-progress :percent="55" />
+                      </div>
+                      <div class="grofooter">
+                        <div class="ftext">组员名单 ></div>
+                        <div class="peoples">
+                          <div class="people1">
+                            <img
+                              src="../../assets/images/taskpage/people1.png"
+                            />
+                          </div>
+                          <div class="people2">
+                            <img
+                              src="../../assets/images/taskpage/people2.png"
+                            />
+                          </div>
+                          <div class="people3">
+                            <img
+                              src="../../assets/images/taskpage/people3.png"
+                            />
+                          </div>
+                          <div class="people4">
+                            <img
+                              src="../../assets/images/taskpage/people4.png"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="groupbox">
+                    <div style="width: 90%">
+                      <div class="grouptitle">
+                        <div class="goodgruop">宇宙第一最强小组</div>
+                        <div class="more">
+                          <span
+                            style="color: rgba(0, 0, 0, 0.45); cursor: pointer"
+                            >. . .</span
+                          >
+                          <div class="moreItems">
+                            <div class="sammo">编辑</div>
+                            <div class="sammo">删除</div>
+                          </div>
+                        </div>
+                      </div>
+                      <div class="leader">组长：小李</div>
+                      <div class="grocenter">
+                        <div class="leader1">进度</div>
+                        <a-progress :percent="55" />
+                      </div>
+                      <div class="grofooter">
+                        <div class="ftext">组员名单 ></div>
+                        <div class="peoples">
+                          <div class="people1">
+                            <img
+                              src="../../assets/images/taskpage/people1.png"
+                            />
+                          </div>
+                          <div class="people2">
+                            <img
+                              src="../../assets/images/taskpage/people2.png"
+                            />
+                          </div>
+                          <div class="people3">
+                            <img
+                              src="../../assets/images/taskpage/people3.png"
+                            />
+                          </div>
+                          <div class="people4">
+                            <img
+                              src="../../assets/images/taskpage/people4.png"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="groupbox">
+                    <div style="width: 90%">
+                      <div class="grouptitle">
+                        <div class="goodgruop">天天向上小组</div>
+                        <div class="more">
+                          <span
+                            style="color: rgba(0, 0, 0, 0.45); cursor: pointer"
+                            >. . .</span
+                          >
+                          <div class="moreItems">
+                            <div class="sammo">编辑</div>
+                            <div class="sammo">删除</div>
+                          </div>
+                        </div>
+                      </div>
+                      <div class="leader">组长：小李</div>
+                      <div class="grocenter">
+                        <div class="leader1">进度</div>
+                        <a-progress :percent="55" />
+                      </div>
+                      <div class="grofooter">
+                        <div class="ftext">组员名单 ></div>
+                        <div class="peoples">
+                          <div class="people1">
+                            <img
+                              src="../../assets/images/taskpage/people1.png"
+                            />
+                          </div>
+                          <div class="people2">
+                            <img
+                              src="../../assets/images/taskpage/people2.png"
+                            />
+                          </div>
+                          <div class="people3">
+                            <img
+                              src="../../assets/images/taskpage/people3.png"
+                            />
+                          </div>
+                          <div class="people4">
+                            <img
+                              src="../../assets/images/taskpage/people4.png"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </a-tab-pane>
+            </a-tabs>
+          </div>
         </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>
@@ -698,7 +826,13 @@
     <face-manage v-model:Fvisible="FaceVisivle" />
     <!-- 学员（小组管理）创建小组抽屉 -->
     <subset-manage v-model:Svisible="subsetVisivle" />
-<!-- 概览（无数据）-项目发布弹窗 -->
+    <!-- 面授学员抽屉 -->
+    <face-stu v-model:FSvisible="FSvisible" />
+    <!-- 活动考勤抽屉 -->
+    <active-attendance v-model:AAvisible="AAvisible" />
+    <!-- 作业管理抽屉 -->
+    <work-manage v-model:Wvisible="Wvisible" />
+    <!-- 概览（无数据）-项目发布弹窗 -->
     <div>
       <a-modal
         v-model:visible="pubproject"
@@ -718,7 +852,11 @@
             display: flex;
             align-items: center;
             justify-content: space-between;
-            background: linear-gradient(0deg,rgba(78, 166, 255, 0) 0%,rgba(78, 166, 255, 0.2) 100%);
+            background: linear-gradient(
+              0deg,
+              rgba(78, 166, 255, 0) 0%,
+              rgba(78, 166, 255, 0.2) 100%
+            );
           "
         >
           <div class="headerLeft" style="margin-left: 32px">
@@ -773,9 +911,9 @@
         </div>
       </a-modal>
     </div>
-<!-- 概览（无数据）-项目发布弹窗 -->
-<!-- 学员-创建小组弹窗 -->
-<div>
+    <!-- 概览（无数据）-项目发布弹窗 -->
+    <!-- 学员-创建小组弹窗 -->
+    <div>
       <a-modal
         v-model:visible="stugroup"
         :title="null"
@@ -785,19 +923,31 @@
         wrapClassName="doublepro"
         width="624px"
         height="332px"
+      >
+        <div
+          class="modalHeader"
+          style="
+            width: 100%;
+            height: 68px;
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            background: linear-gradient(
+              0deg,
+              rgba(78, 166, 255, 0) 0%,
+              rgba(78, 166, 255, 0.2) 100%
+            );
+          "
         >
-        <div class="modalHeader" 
-              style="width: 100%;height: 68px;display: flex;align-items: center;justify-content: space-between;background:linear-gradient(0deg,rgba(78, 166, 255, 0) 0%,rgba(78, 166, 255, 0.2000) 100%)"
-            >
-            <div class="headerLeft" style="margin-left: 32px">
-              <span class="headerLeftText" style="font-size: 16px">创建小组</span>
-            </div>
-            <div style="cursor: pointer;margin-right:32px" @click="closeModal2">
-              <img
-                style="width: 22px; height: 22px"
-                src="../../assets/images/basicinfo/close22.png"
-              />
-            </div>
+          <div class="headerLeft" style="margin-left: 32px">
+            <span class="headerLeftText" style="font-size: 16px">创建小组</span>
+          </div>
+          <div style="cursor: pointer; margin-right: 32px" @click="closeModal2">
+            <img
+              style="width: 22px; height: 22px"
+              src="../../assets/images/basicinfo/close22.png"
+            />
+          </div>
         </div>
         <div class="modalMain">
           <div class="name">
@@ -812,211 +962,224 @@
               <a-input
                 v-model:value="value"
                 placeholder="请输入小组名称"
-                style="border-radius: 8px;height: 40px"
+                style="border-radius: 8px; height: 40px"
               />
             </div>
           </div>
           <div class="name">
             <div class="star" style="margin-top: -4px">
               <img
-                style="width: 10px; height: 10px;margin-left: 15px"
+                style="width: 10px; height: 10px; margin-left: 15px"
                 src="../../assets/images/basicinfo/asterisk.png"
               />
             </div>
-            <div class="inname" >小组长:</div>
+            <div class="inname">小组长:</div>
             <div class="in">
               <a-input
                 v-model:value="value"
                 placeholder="请输入小组长"
-                style="border-radius: 8px;height: 40px"
+                style="border-radius: 8px; height: 40px"
               />
             </div>
           </div>
           <div class="pubtn">
-                    <a-button class="pubtn1" @click="closeModal2">取消</a-button>
-                    <a-button class="pubtn2" @click="closeModal2">确定</a-button>
+            <a-button class="pubtn1" @click="closeModal2">取消</a-button>
+            <a-button class="pubtn2" @click="closeModal2">确定</a-button>
           </div>
         </div>
       </a-modal>
-</div>
-<!-- 学员-创建小组弹窗 -->
-</div>
+    </div>
+    <!-- 学员-创建小组弹窗 -->
+  </div>
 </template>
   <script>
 import { reactive, toRefs } from "vue";
 import TimeManage from "../../components/drawers/TimeManage";
 import FaceManage from "../../components/drawers/FaceManage";
 import SubsetManage from "../../components/drawers/SubsetManage";
+import ActiveAttendance from "../../components/drawers/ActiveAttendance";
+import WorkManage from "../../components/drawers/WorkManage.vue";
+import FaceStu from "../../components/drawers/FaceStu";
 export default {
-    name:"taskPage",
-    components: { TimeManage, FaceManage, SubsetManage },
-    setup(){
-        const state = reactive({
-            goodstuList: [
-              {
-                id: 1,
-                value: "全部",
-                label: "全部",
-              },
-              {
-                id: 2,
-                value: "普通学员",
-                label: "普通学员",
-              },
-              {
-                id: 3,
-                value: "优秀学员",
-                label: "优秀学员",
-              },
-            ],
-            tabledata: [
-              {
-                key: 1,
-                name: "小李",
-                bum: "产研部",
-                gangw: "产品经理",
-                group: "好好学习",
-                progress: "5/20",
-                diploma: "0",
-                stutime: "2022-10-31 23:12:00",
-                putin: "手动加入",
-              },
-              {
-                key: 2,
-                name: "小刘",
-                bum: "产研部",
-                gangw: "产品经理",
-                group: "天天向上",
-                progress: "5/20",
-                diploma: "0",
-                stutime: "2022-10-21 23:12:00",
-                putin: "手动加入",
-              },
-              {
-                key: 3,
-                name: "小王",
-                bum: "产研部",
-                gangw: "后端",
-                group: "好好学习",
-                progress: "5/20",
-                diploma: "0",
-                stutime: "2022-10-11 23:12:00",
-                putin: "手动加入",
-              },
-              {
-                key: 4,
-                name: "小赵",
-                bum: "产研部",
-                gangw: "前端",
-                group: "天天向上",
-                progress: "5/20",
-                diploma: "0",
-                stutime: "2022-10-31 23:12:00",
-                putin: "手动加入",
-              },
-            ],
-            tablecolumns: [
-              {
-                title: "姓名",
-                dataIndex: "name",
-                key: "name",
-                width: 30,
-                align: "left",
-                className: "h",
-              },
-              {
-                title: "部门",
-                dataIndex: "bum",
-                key: "bum",
-                width: 40,
-                align: "center",
-                className: "h",
-              },
-              {
-                title: "岗位",
-                dataIndex: "gangw",
-                key: "gangw",
-                width: 40,
-                align: "center",
-                className: "h",
-              },
-              {
-                title: "所属小组",
-                dataIndex: "group",
-                key: "group",
-                width: 40,
-                align: "center",
-                className: "h",
-              },
-              {
-                title: "进度",
-                dataIndex: "progress",
-                key: "progress",
-                width: 40,
-                align: "center",
-                className: "h",
-              },
-              {
-                title: "证书",
-                dataIndex: "diploma",
-                key: "diploma",
-                width: 40,
-                align: "center",
-                className: "h",
-              },
-              {
-                title: "最近学习时间",
-                dataIndex: "stutime",
-                key: "stutime",
-                width: 50,
-                align: "center",
-                className: "h",
-                sorter: {
-                  compare: (a, b) => a.stutime - b.stutime,
-                  multiple: 3,
-                },
-              },
-              {
-                title: "加入方式",
-                dataIndex: "putin",
-                key: "putin",
-                width: 40,
-                align: "center",
-                className: "h",
-              },
-              {
-                title: "操作",
-                dataIndex: "operations",
-                key: "operations",
-                width: 60,
-                align: "center",
-                className: "h",
-              },
-            ],
-            visible: false, //时间管理
-            FaceVisivle: false, //面授管理
-            subsetVisivle: false, //随机小组
-            pubproject: false,
-            stugroup: false,
-            checked: false,
-            checked1: true,
-            checked2: false,
-            activeKey: '3',
-            activeKey1: '8',
-        });
-        const showModal = () => {
-            state.pubproject = true;
-        };
-        const closeModal = () => {
-            state.pubproject = false;       
-        };
-        const showModal2 = () => {
-            state.stugroup = true;
-        };
-        const closeModal2 = () => {
-            state.stugroup = false;       
-        };
-        //新增
+  name: "taskPage",
+  components: {
+    TimeManage,
+    FaceManage,
+    SubsetManage,
+    FaceStu,
+    ActiveAttendance,
+    WorkManage,
+  },
+  setup() {
+    const state = reactive({
+      goodstuList: [
+        {
+          id: 1,
+          value: "全部",
+          label: "全部",
+        },
+        {
+          id: 2,
+          value: "普通学员",
+          label: "普通学员",
+        },
+        {
+          id: 3,
+          value: "优秀学员",
+          label: "优秀学员",
+        },
+      ],
+      tabledata: [
+        {
+          key: 1,
+          name: "小李",
+          bum: "产研部",
+          gangw: "产品经理",
+          group: "好好学习",
+          progress: "5/20",
+          diploma: "0",
+          stutime: "2022-10-31 23:12:00",
+          putin: "手动加入",
+        },
+        {
+          key: 2,
+          name: "小刘",
+          bum: "产研部",
+          gangw: "产品经理",
+          group: "天天向上",
+          progress: "5/20",
+          diploma: "0",
+          stutime: "2022-10-21 23:12:00",
+          putin: "手动加入",
+        },
+        {
+          key: 3,
+          name: "小王",
+          bum: "产研部",
+          gangw: "后端",
+          group: "好好学习",
+          progress: "5/20",
+          diploma: "0",
+          stutime: "2022-10-11 23:12:00",
+          putin: "手动加入",
+        },
+        {
+          key: 4,
+          name: "小赵",
+          bum: "产研部",
+          gangw: "前端",
+          group: "天天向上",
+          progress: "5/20",
+          diploma: "0",
+          stutime: "2022-10-31 23:12:00",
+          putin: "手动加入",
+        },
+      ],
+      tablecolumns: [
+        {
+          title: "姓名",
+          dataIndex: "name",
+          key: "name",
+          width: 30,
+          align: "left",
+          className: "h",
+        },
+        {
+          title: "部门",
+          dataIndex: "bum",
+          key: "bum",
+          width: 40,
+          align: "center",
+          className: "h",
+        },
+        {
+          title: "岗位",
+          dataIndex: "gangw",
+          key: "gangw",
+          width: 40,
+          align: "center",
+          className: "h",
+        },
+        {
+          title: "所属小组",
+          dataIndex: "group",
+          key: "group",
+          width: 40,
+          align: "center",
+          className: "h",
+        },
+        {
+          title: "进度",
+          dataIndex: "progress",
+          key: "progress",
+          width: 40,
+          align: "center",
+          className: "h",
+        },
+        {
+          title: "证书",
+          dataIndex: "diploma",
+          key: "diploma",
+          width: 40,
+          align: "center",
+          className: "h",
+        },
+        {
+          title: "最近学习时间",
+          dataIndex: "stutime",
+          key: "stutime",
+          width: 50,
+          align: "center",
+          className: "h",
+          sorter: {
+            compare: (a, b) => a.stutime - b.stutime,
+            multiple: 3,
+          },
+        },
+        {
+          title: "加入方式",
+          dataIndex: "putin",
+          key: "putin",
+          width: 40,
+          align: "center",
+          className: "h",
+        },
+        {
+          title: "操作",
+          dataIndex: "operations",
+          key: "operations",
+          width: 60,
+          align: "center",
+          className: "h",
+        },
+      ],
+      visible: false, //时间管理
+      FaceVisivle: false, //面授管理
+      subsetVisivle: false, //随机小组
+      FSvisible: false, //面授学员
+      AAvisible: false, //活动考勤
+      Wvisible: false, //作业管理
+      pubproject: false,
+      stugroup: false,
+      checked: false,
+      checked1: true,
+      checked2: false,
+      activeKey: "3",
+      activeKey1: "8",
+    });
+    const showModal = () => {
+      state.pubproject = true;
+    };
+    const closeModal = () => {
+      state.pubproject = false;
+    };
+    const showModal2 = () => {
+      state.stugroup = true;
+    };
+    const closeModal2 = () => {
+      state.stugroup = false;
+    };
+    //新增
     const showTime = () => {
       console.log("点击管理");
       state.visible = true;
@@ -1032,15 +1195,30 @@ export default {
       // console.log("点击管理");
       state.subsetVisivle = true;
     };
-        return {
-            ...toRefs(state),
-            showModal,
-            closeModal,
-            showModal2,
-            closeModal2,
-            showTime,
+    //面授学员的弹窗
+    const showFS = () => {
+      state.FSvisible = true;
+    };
+    //活动考勤的抽屉
+    const showAA = () => {
+      state.AAvisible = true;
+    };
+    //作业管理的抽屉
+    const showWork = () => {
+      state.Wvisible = true;
+    };
+    return {
+      ...toRefs(state),
+      showModal,
+      closeModal,
+      showModal2,
+      closeModal2,
+      showTime,
       showFace,
       showSubset,
+      showFS,
+      showAA,
+      showWork,
     };
   },
 };
@@ -1214,45 +1392,44 @@ export default {
               width: 100%;
               height: 40px;
               .ant-select-selector {
-              border-radius: 8px;
-              // height: 120%;
-              width: 100%;
-              height: 40px;
-            }
+                border-radius: 8px;
+                // height: 120%;
+                width: 100%;
+                height: 40px;
+              }
             }
           }
-        
-      }
-      .pubtn {
-            display: flex;
-            justify-content: center;
-            margin-top: 25px;
-            //margin-bottom: 29px;
-            .pubtn1 {
-                width: 100px;
-                height: 40px;
-                margin-right: 16px;
-                margin-bottom: 29px;
-                border: 1px solid #409EFF;
-                border-radius: 4px;
-                color: rgba(78, 166, 255, 1);
-                font-size: 14px;
-                //line-height: 36px;
-                align-items: center;
-                background: rgba(255, 255, 255, 1)
-            }
-            .pubtn2 {
-                width: 100px;
-                height: 40px;
-                margin-bottom: 29px;
-                border: 1px solid #409EFF;
-                border-radius: 4px;
-                color: #FFFFFF;
-                font-size: 14px;
-                align-items: center;
-                //line-height: 36px;
-                background: #409EFF;
-            }
+        }
+        .pubtn {
+          display: flex;
+          justify-content: center;
+          margin-top: 25px;
+          //margin-bottom: 29px;
+          .pubtn1 {
+            width: 100px;
+            height: 40px;
+            margin-right: 16px;
+            margin-bottom: 29px;
+            border: 1px solid #409eff;
+            border-radius: 4px;
+            color: rgba(78, 166, 255, 1);
+            font-size: 14px;
+            //line-height: 36px;
+            align-items: center;
+            background: rgba(255, 255, 255, 1);
+          }
+          .pubtn2 {
+            width: 100px;
+            height: 40px;
+            margin-bottom: 29px;
+            border: 1px solid #409eff;
+            border-radius: 4px;
+            color: #ffffff;
+            font-size: 14px;
+            align-items: center;
+            //line-height: 36px;
+            background: #409eff;
+          }
         }
       }
     }
@@ -1770,69 +1947,69 @@ export default {
       font-weight: 700;
     }
     .group {
-            display: flex;
-            justify-content: space-between;
-            .groupleft {
-                display: flex;
-                flex-wrap: wrap;
-                align-items: center;
-                margin-left: 32px;
-                .groupname {
-                    height: 22px;
-                    width: 70px;
-                    color: #000000;
-                    font-size: 14px;
-                }
-                .ant-input {
-                    border-radius: 8px;
-                    width: 264px;
-                    height: 40px;
-                }
-                .ant-select-selector {
-                    border-radius: 8px;
-                    width: 264px;
-                    height: 40px;
-                    padding-top: 5px;
-                }
-            }
-            .groupright {
-                display: flex;
-                .btn1 {
-                    width: 100px;
-                    height: 40px;
-                    display: flex;
-                    align-items: center;
-                    justify-content: center;
-                    margin-right: 16px;
-                    border: 1px solid #409EFF;
-                    border-radius: 8px;
-                    background: #409EFF;
-                    cursor: pointer;
-                    .btn1text {
-                        color: #FFFFFF;
-                        margin-left: 5px;
-                        font-size: 14px;
-                    }
-                }
-                .btn2 {
-                    width: 100px;
-                    height: 40px;
-                    display: flex;
-                    align-items: center;
-                    justify-content: center;
-                    margin-right: 32px;
-                    border: 1px solid #409EFF;
-                    border-radius: 8px;
-                    cursor: pointer;
-                    background: #FFFFFF;
-                    .btn2text {
-                        color: #409EFF;
-                        margin-left: 5px;
-                        font-size: 14px;
-                    }
-                }
-            }
+      display: flex;
+      justify-content: space-between;
+      .groupleft {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        margin-left: 32px;
+        .groupname {
+          height: 22px;
+          width: 70px;
+          color: #000000;
+          font-size: 14px;
         }
+        .ant-input {
+          border-radius: 8px;
+          width: 264px;
+          height: 40px;
+        }
+        .ant-select-selector {
+          border-radius: 8px;
+          width: 264px;
+          height: 40px;
+          padding-top: 5px;
+        }
+      }
+      .groupright {
+        display: flex;
+        .btn1 {
+          width: 100px;
+          height: 40px;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          margin-right: 16px;
+          border: 1px solid #409eff;
+          border-radius: 8px;
+          background: #409eff;
+          cursor: pointer;
+          .btn1text {
+            color: #ffffff;
+            margin-left: 5px;
+            font-size: 14px;
+          }
+        }
+        .btn2 {
+          width: 100px;
+          height: 40px;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          margin-right: 32px;
+          border: 1px solid #409eff;
+          border-radius: 8px;
+          cursor: pointer;
+          background: #ffffff;
+          .btn2text {
+            color: #409eff;
+            margin-left: 5px;
+            font-size: 14px;
+          }
+        }
+      }
+    }
     .second2 {
       display: flex;
       margin: 30px 0 0 32px;
@@ -1872,212 +2049,212 @@ export default {
       }
     }
     .talk {
-          margin-top: 24px;
-          margin-left: 32px;
-          margin-right: 32px;
-          margin-bottom: 11px;
-          position: relative;
-          //width: 90%;
-          height: 40px;
-          background: #f5faff;
-          border: 1px solid #4ea6ff;
-          // opacity: 0.22;
-          display: flex;
-          align-items: center;
-          .im {
-            width: 14px;
-            height: 15px;
-            margin-left: 17px;
-          }
-          .xu {
-            height: 100%;
-            line-height: 40px;
-            margin-left: 13px;
-            .yi {
-              color: #4f5156;
-              font-size: 14px;
-            }
-            .zon {
-              color: #999ba3;
-              font-size: 14px;
-              margin-left: 34px;
-            }
-            .th {
-              color: #4ea6ff;
-            }
-          }
-          .clear {
-            cursor: pointer;
-            font-size: 14px;
-            color: #387DF7;
-            line-height: 24px;
-            position: absolute;
-            right: 20px;
-          }
+      margin-top: 24px;
+      margin-left: 32px;
+      margin-right: 32px;
+      margin-bottom: 11px;
+      position: relative;
+      //width: 90%;
+      height: 40px;
+      background: #f5faff;
+      border: 1px solid #4ea6ff;
+      // opacity: 0.22;
+      display: flex;
+      align-items: center;
+      .im {
+        width: 14px;
+        height: 15px;
+        margin-left: 17px;
+      }
+      .xu {
+        height: 100%;
+        line-height: 40px;
+        margin-left: 13px;
+        .yi {
+          color: #4f5156;
+          font-size: 14px;
+        }
+        .zon {
+          color: #999ba3;
+          font-size: 14px;
+          margin-left: 34px;
+        }
+        .th {
+          color: #4ea6ff;
+        }
+      }
+      .clear {
+        cursor: pointer;
+        font-size: 14px;
+        color: #387df7;
+        line-height: 24px;
+        position: absolute;
+        right: 20px;
+      }
     }
     .tab {
-        .ant-table-thead > tr > th {
-          background-color: rgba(239, 244, 252, 1);
-          color: rgba(0, 0, 0, 0.8500);
-        }
-        .ant-table-tbody > tr > td {
-          border-bottom: 1px solid #F0F6FC;
-          color: rgba(0, 0, 0, 0.6500);
-        }
-        th.h {
-          background-color: #eff4fc !important;
-        }
-        
-        .ant-table-tbody
-          > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
-          > td {
-          background: rgba(250, 250, 250, 1);
-        }
-        .pa {
-          // left: 0;
-          margin-top: 15px;
-          width: 100%;
-          // height: 20px;
-          // background-color: red;
-          display: flex;
-          justify-content: right;
-          // position: absolute;
-          // bottom: 20px;
-        }
+      .ant-table-thead > tr > th {
+        background-color: rgba(239, 244, 252, 1);
+        color: rgba(0, 0, 0, 0.85);
+      }
+      .ant-table-tbody > tr > td {
+        border-bottom: 1px solid #f0f6fc;
+        color: rgba(0, 0, 0, 0.65);
+      }
+      th.h {
+        background-color: #eff4fc !important;
+      }
+
+      .ant-table-tbody
+        > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
+        > td {
+        background: rgba(250, 250, 250, 1);
+      }
+      .pa {
+        // left: 0;
+        margin-top: 15px;
+        width: 100%;
+        // height: 20px;
+        // background-color: red;
+        display: flex;
+        justify-content: right;
+        // position: absolute;
+        // bottom: 20px;
+      }
     }
     .groupmain {
+      display: flex;
+      flex-wrap: wrap;
+      margin-left: 32px;
+      .groupbox {
+        width: 264px;
+        height: 181px;
+        display: flex;
+        justify-content: center;
+        border: 1px solid #e9e9e9;
+        box-shadow: 1px 1px 18px 1px rgba(0, 0, 0, 0.05);
+        margin-top: 16px;
+        margin-right: 20px;
+        .grouptitle {
+          display: flex;
+          justify-content: space-between;
+          margin-top: 5px;
+          border-bottom: 1px solid rgba(232, 232, 232, 1);
+          .goodgruop {
+            color: rgba(0, 0, 0, 0.85);
+            font-size: 16px;
+            line-height: 36px;
+            font-weight: 600;
+          }
+          .more {
+            position: relative;
+            //margin-right: 30px;
+            height: 30px;
             display: flex;
-            flex-wrap: wrap;
-            margin-left: 32px;
-            .groupbox {
-                width: 264px;
-                height: 181px;
-                display: flex;
-                justify-content: center;
-                border: 1px solid #E9E9E9;
-                box-shadow: 1px 1px 18px 1px rgba(0, 0, 0, 0.0500);
-                margin-top: 16px;
-                margin-right: 20px;
-                .grouptitle {
-                    display: flex;
-                    justify-content: space-between;
-                    margin-top: 5px;
-                    border-bottom: 1px solid rgba(232, 232, 232, 1);
-                    .goodgruop {
-                        color: rgba(0, 0, 0, 0.8500);
-                        font-size: 16px;
-                        line-height: 36px;
-                        font-weight: 600;
-                    } 
-                    .more {
-                        position: relative;
-                        //margin-right: 30px;
-                        height: 30px;
-                        display: flex;
-                        align-items: center;
-                        .moreItems {
-                        width: 76px;
-                        height: 80px;
-                        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: -48px;
-                        top: 30px;
-                        z-index: 100;
-                        cursor: pointer;
-                        .sammo {
-                            text-align: center;
-                            margin-top: 12px;
-                            cursor: pointer;
-                        }
-                        .sammo:hover {
-                            color: #4ea6ff;
-                        }
-                        }
-                        .moreItems:hover {
-                        display: block;
-                        }
-                    }
-                    @media screen and (max-width: 1240px) {
-                        .line {
-                        margin-right: 10px;
-                        }
-                        .img1 {
-                        margin-right: 15px;
-                        }
-                        .img2 {
-                        margin-right: 10px;
-                        }
-                        .return {
-                        margin-right: 10px;
-                        }
-                        .pub {
-                        margin-right: 10px;
-                        }
-                        .more {
-                        margin-right: 10px;
-                        }
-                    }
-                    .more:hover .moreArrow {
-                        background-image: url("../../assets/images/navtop/up.png");
-                    }
-                    .more:hover .moreItems {
-                        display: block;
-                    }                  
-                }
-                .leader {
-                    color: rgba(0, 0, 0, 1);
-                    font-size: 14px;
-                    margin-top: 16px;
-                    //margin-left: 24px;
-                }
-                .grocenter {
-                    display: flex;
-                    margin-top: 14px;
-                    .leader1 {
-                        color: rgba(0, 0, 0, 1);
-                        font-size: 14px;
-                        width: 51px;
-                    }
-                    .ant-progress-outer {
-                        width: 170px;
-                    }
-                }
-                .grofooter {
-                    display: flex;
-                    justify-content: space-between;
-                    cursor: pointer;
-                    margin-top: 30px;
-                    .ftext {
-                        color: rgba(56, 139, 225, 1);
-                        font-size: 14px;
-                    }
-                    .peoples {
-                        display: flex;
-                        position: relative;
-                        .people1 {
-                          position: absolute;
-                          right: 22px;
-                        }
-                        .people2 {
-                          position: absolute;
-                          right: 31px;
-                        }
-                        .people3 {
-                          position: absolute;
-                          right: 40px;
-                        }
-                        .people4 {
-                          position: absolute;
-                          right: 49px;
-                        }
-                    }
-                }
+            align-items: center;
+            .moreItems {
+              width: 76px;
+              height: 80px;
+              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: -48px;
+              top: 30px;
+              z-index: 100;
+              cursor: pointer;
+              .sammo {
+                text-align: center;
+                margin-top: 12px;
+                cursor: pointer;
+              }
+              .sammo:hover {
+                color: #4ea6ff;
+              }
             }
+            .moreItems:hover {
+              display: block;
+            }
+          }
+          @media screen and (max-width: 1240px) {
+            .line {
+              margin-right: 10px;
+            }
+            .img1 {
+              margin-right: 15px;
+            }
+            .img2 {
+              margin-right: 10px;
+            }
+            .return {
+              margin-right: 10px;
+            }
+            .pub {
+              margin-right: 10px;
+            }
+            .more {
+              margin-right: 10px;
+            }
+          }
+          .more:hover .moreArrow {
+            background-image: url("../../assets/images/navtop/up.png");
+          }
+          .more:hover .moreItems {
+            display: block;
+          }
         }
+        .leader {
+          color: rgba(0, 0, 0, 1);
+          font-size: 14px;
+          margin-top: 16px;
+          //margin-left: 24px;
+        }
+        .grocenter {
+          display: flex;
+          margin-top: 14px;
+          .leader1 {
+            color: rgba(0, 0, 0, 1);
+            font-size: 14px;
+            width: 51px;
+          }
+          .ant-progress-outer {
+            width: 170px;
+          }
+        }
+        .grofooter {
+          display: flex;
+          justify-content: space-between;
+          cursor: pointer;
+          margin-top: 30px;
+          .ftext {
+            color: rgba(56, 139, 225, 1);
+            font-size: 14px;
+          }
+          .peoples {
+            display: flex;
+            position: relative;
+            .people1 {
+              position: absolute;
+              right: 22px;
+            }
+            .people2 {
+              position: absolute;
+              right: 31px;
+            }
+            .people3 {
+              position: absolute;
+              right: 40px;
+            }
+            .people4 {
+              position: absolute;
+              right: 49px;
+            }
+          }
+        }
+      }
+    }
   }
 }
 </style>