From 7f5d8c8adf2f2a564f61e6ee911f724bc14f6bcf Mon Sep 17 00:00:00 2001
From: wuyx <wuyx@dongwu-inc.com>
Date: Fri, 21 Oct 2022 16:59:14 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E8=AE=BE=E7=BD=AEtab=E5=92=8C=E7=A9=BA?=
 =?UTF-8?q?=E6=A0=BC=E4=B8=8D=E5=90=8C=E6=97=B6=E6=A0=A1=E9=AA=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                         |  108 +-
 src/views/projectcenter/TaskPage.vue | 6379 +++++++++++++-------------
 2 files changed, 3221 insertions(+), 3266 deletions(-)

diff --git a/package.json b/package.json
index aef43c56..b58bbc98 100644
--- a/package.json
+++ b/package.json
@@ -1,53 +1,57 @@
 {
-  "name": "fe_manage",
-  "version": "0.1.0",
-  "private": true,
-  "scripts": {
-    "serve": "vue-cli-service serve",
-    "build": "vue-cli-service build",
-    "lint": "vue-cli-service lint"
-  },
-  "dependencies": {
-    "ant-design-vue": "^3.2.12",
-    "axios": "^1.1.3",
-    "core-js": "^3.8.3",
-    "element-plus": "^2.2.17",
-    "jquery": "^3.6.1",
-    "vue": "^3.2.13",
-    "vue-router": "^4.0.3",
-    "vuex": "^4.0.0"
-  },
-  "devDependencies": {
-    "@babel/core": "^7.12.16",
-    "@babel/eslint-parser": "^7.12.16",
-    "@vue/cli-plugin-babel": "~5.0.0",
-    "@vue/cli-plugin-eslint": "~5.0.0",
-    "@vue/cli-plugin-router": "~5.0.0",
-    "@vue/cli-plugin-vuex": "~5.0.0",
-    "@vue/cli-service": "~5.0.0",
-    "eslint": "^7.32.0",
-    "eslint-plugin-vue": "^8.0.3",
-    "sass": "^1.32.7",
-    "sass-loader": "^12.0.0"
-  },
-  "eslintConfig": {
-    "root": true,
-    "env": {
-      "node": true
-    },
-    "extends": [
-      "plugin:vue/vue3-essential",
-      "eslint:recommended"
-    ],
-    "parserOptions": {
-      "parser": "@babel/eslint-parser"
-    },
-    "rules": {}
-  },
-  "browserslist": [
-    "> 1%",
-    "last 2 versions",
-    "not dead",
-    "not ie 11"
-  ]
-}
+	"name": "fe_manage",
+	"version": "0.1.0",
+	"private": true,
+	"scripts": {
+		"serve": "vue-cli-service serve",
+		"build": "vue-cli-service build",
+		"lint": "vue-cli-service lint"
+	},
+	"dependencies": {
+		"ant-design-vue": "^3.2.12",
+		"axios": "^1.1.3",
+		"core-js": "^3.8.3",
+		"element-plus": "^2.2.17",
+		"jquery": "^3.6.1",
+		"vue": "^3.2.13",
+		"vue-router": "^4.0.3",
+		"vuex": "^4.0.0"
+	},
+	"devDependencies": {
+		"@babel/core": "^7.12.16",
+		"@babel/eslint-parser": "^7.12.16",
+		"@vue/cli-plugin-babel": "~5.0.0",
+		"@vue/cli-plugin-eslint": "~5.0.0",
+		"@vue/cli-plugin-router": "~5.0.0",
+		"@vue/cli-plugin-vuex": "~5.0.0",
+		"@vue/cli-service": "~5.0.0",
+		"eslint": "^7.32.0",
+		"eslint-plugin-vue": "^8.0.3",
+		"sass": "^1.32.7",
+		"sass-loader": "^12.0.0"
+	},
+	"eslintConfig": {
+		"root": true,
+		"env": {
+			"node": true
+		},
+		"extends": [
+			"plugin:vue/vue3-essential",
+			"eslint:recommended"
+		],
+		"parserOptions": {
+			"parser": "@babel/eslint-parser"
+		},
+		"rules": {
+			"no-console": "off",
+			"no-debugger": "off",
+			"no-mixed-spaces-and-tabs": "off"
+		}
+	},
+	"browserslist": [
+		"> 1%",
+		"last 2 versions",
+		"not dead",
+		"not ie 11"
+	]
+}
\ No newline at end of file
diff --git a/src/views/projectcenter/TaskPage.vue b/src/views/projectcenter/TaskPage.vue
index d0fa81ad..0e334666 100644
--- a/src/views/projectcenter/TaskPage.vue
+++ b/src/views/projectcenter/TaskPage.vue
@@ -1,1247 +1,990 @@
 <!-- 任务页面 -->
 <template>
-  <div class="taskpage">
-    <div class="addhead" style="flex-shrink: 0">
-      <div class="leftimg">
-        <img class="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至2022-10-21 00:00</div>
-      </div>
-      <div class="right">
-        <img class="img1" src="../../assets/images/leveladd/ma.png" />
-        <div class="line"></div>
-        <img class="img2" src="../../assets/images/leveladd/pub.png" />
-        <div class="pub">发布</div>
-        <div class="line"></div>
-        <img
-          style="margin-right: 15px"
-          class="img2"
-          src="../../assets/images/leveladd/more.png"
-        />
-        <div class="more">
-          <span style="color: #7096e3; cursor: pointer">更多</span>
-          <div class="moreArrow"></div>
-          <div class="moreItems">
-            <div class="sammo">撤回</div>
-            <div class="sammo">复制</div>
-          </div>
-        </div>
-        <div class="line"></div>
-        <router-link to="/projectmanage"
-          ><div style="display: flex">
-            <img class="img2" src="../../assets/images/leveladd/back.png" />
-            <div class="return">返回</div>
-          </div></router-link
-        >
-      </div>
-    </div>
-    <div class="split" style="flex-shrink: 0"></div>
-    <div class="content">
-      <a-tabs
-        class="tab"
-        v-model:activeKey="activeKey"
-        size="large"
-        :tabBarStyle="{ marginLeft: '10px', marginTop: '5px' }"
-      >
-        <a-tab-pane key="1" tab="概览">
-          <div class="split"></div>
-          <!-- 概览（无数据） -->
-          <div>
-            <div class="onerow">
-              <div class="taskmain">快速创建项目详情</div>
-            </div>
-            <div class="second">
-              <div
-                class="taskbox"
-                style="background: linear-gradient(180deg, #fef3dd, #fffaf0)"
-              >
-                <div class="leftt">
-                  <img src="../../assets/images/taskpage/left1.png" />
-                </div>
-                <div class="photo">
-                  <img src="../../assets/images/taskpage/picture1.png" />
-                </div>
-                <div class="rightt">
-                  <img src="../../assets/images/taskpage/right1.png" />
-                </div>
-                <div class="centerbox" style="color: rgba(255, 182, 78, 1)">
-                  添加任务
-                </div>
-                <div class="centermain">快速添加任务/阶段</div>
-              </div>
-              <div
-                class="taskbox"
-                style="background: linear-gradient(180deg, #ddeaff, #f0f8fe)"
-              >
-                <div class="leftt">
-                  <img src="../../assets/images/taskpage/left2.png" />
-                </div>
-                <div class="photo">
-                  <img src="../../assets/images/taskpage/picture2.png" />
-                </div>
-                <div class="rightt">
-                  <img src="../../assets/images/taskpage/right2.png" />
-                </div>
-                <div class="centerbox" style="color: rgba(78, 166, 255, 1)">
-                  添加学员
-                </div>
-                <div class="centermain">快速添加学员</div>
-              </div>
-              <div
-                class="taskbox"
-                @click="showModal"
-                style="background: linear-gradient(180deg, #e5f6ec, #eef9f3)"
-              >
-                <div class="leftt">
-                  <img src="../../assets/images/taskpage/left3.png" />
-                </div>
-                <div class="photo">
-                  <img src="../../assets/images/taskpage/picture3.png" />
-                </div>
-                <div class="rightt">
-                  <img src="../../assets/images/taskpage/right3.png" />
-                </div>
-                <div class="centerbox" style="color: rgba(93, 201, 136, 1)">
-                  发布
-                </div>
-                <div class="centermain">快速发布项目</div>
-              </div>
-            </div>
-          </div>
-          <!-- 概览（无数据） -->
-          <!-- 概览（有数据） -->
-          <div style="display: none">
-            <div class="onerow"><div class="taskmain">项目概览</div></div>
-            <div class="second" style="margin-top: 0">
-              <div class="nubbox">
-                <span class="nub1">200</span>
-                <div class="nub2">总人数</div>
-              </div>
-              <div class="nubbox">
-                <span class="nub1" style="color: #ff90ae">15</span>
-                <div class="nub2">必修课</div>
-              </div>
-              <div class="nubbox">
-                <span class="nub1" style="color: #a497ff">15</span>
-                <div class="nub2">选修课</div>
-              </div>
-              <div class="nubbox">
-                <div>
-                  <span class="nub1" style="color: #5dc988">50</span
-                  ><span style="color: #5dc988; font-size: 14px">%</span>
-                </div>
-                <div class="nub2">完成率</div>
-              </div>
-              <div class="nubbox">
-                <div>
-                  <span class="nub1" style="color: #ff90ae">30</span
-                  ><span style="color: #ff90ae; font-size: 14px">%</span>
-                </div>
-                <div class="nub2">必修完成率</div>
-              </div>
-              <div class="nubbox">
-                <div>
-                  <span class="nub1" style="color: #a497ff">30</span
-                  ><span style="color: #a497ff; font-size: 14px">%</span>
-                </div>
-                <div class="nub2">选修完成率</div>
-              </div>
-            </div>
-            <div class="onerow"><div class="taskmain">阶段信息</div></div>
-            <div class="stagemess">
-              <div class="stage1">阶段1</div>
-              <div class="stage2">阶段2</div>
-            </div>
-            <div class="stagesecond">
-              <div class="staname">阶段名称：</div>
-              <div class="stamess">管理者进阶-腾飞班1第一阶段</div>
-            </div>
-            <div class="stagelast">
-              <div class="stagepro">
-                <a-progress
-                  type="dashboard"
-                  gapDegree="0"
-                  :percent="50"
-                  :width="140"
-                />
-                <div class="protext">课程完成率</div>
-              </div>
-              <div class="stagepro">
-                <a-progress
-                  type="dashboard"
-                  gapDegree="0"
-                  :percent="50"
-                  :width="140"
-                />
-                <div class="protext">考试通过率</div>
-              </div>
-              <div class="stagepro" style="margin-right: 0">
-                <a-progress
-                  type="dashboard"
-                  gapDegree="0"
-                  :percent="50"
-                  :width="140"
-                />
-                <div class="protext">作业合格率</div>
-              </div>
-              <div class="proright">
-                <div class="pronub" style="margin-left: 280px">10</div>
-                <div class="proright1">
-                  <span class="textpro">阶段任务总数</span>
-                  <a-progress :percent="50" style="width: 369px" />
-                </div>
-                <div class="pronub" style="margin-left: 206px">5</div>
-                <div class="proright1">
-                  <span class="textpro">必修课</span>
-                  <a-progress :percent="25" style="width: 369px" />
-                </div>
-                <div class="pronub" style="margin-left: 142px">1</div>
-                <div class="proright1">
-                  <span class="textpro">选修课</span>
-                  <a-progress :percent="5" style="width: 369px" />
-                </div>
-              </div>
-            </div>
-          </div>
-          <!-- 概览（有数据） -->
-        </a-tab-pane>
-        <a-tab-pane key="2" tab="任务" force-render>
-          <div class="split"></div>
-          <div class="onerow">
-            <div class="taskmain">任务大纲</div>
-            <button class="btn">批量面授报名</button>
-            <router-link to="/taskadd" class="edit">
-              <img
-                class="editimg"
-                src="../../assets/images/projectadd/edit.png"
-              />
-              <span class="editext">编辑</span>
-            </router-link>
-          </div>
-          <div class="stage">
-            <span class="stageimg"
-              ><img src="../../assets/images/projectadd/open.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" style="cursor: pointer" @click="showTime">
-                管理
-              </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" style="cursor: pointer">考勤</div>
-              <div class="operation" style="cursor: pointer">管理</div>
-              <div class="operation" style="cursor:pointer">二维码</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" style="cursor: pointer" @click="showFS">
-                学员
-              </div>
-              <div class="operation" style="cursor: pointer" @click="showFace">
-                管理
-              </div>
-              <div class="operation" style="cursor:pointer">二维码</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" style="cursor: pointer" @click="showAA">
-                考勤
-              </div>
-              <div class="operation" style="cursor: pointer">管理</div>
-              <div class="operation" style="cursor:pointer">二维码</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" style="cursor: pointer" @click="showWork">
-                管理
-              </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" style="cursor: pointer" @click="showTest">
-                管理
-              </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="学员">
-          <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="
+	<div class="taskpage">
+		<div class="addhead" style="flex-shrink: 0">
+			<div class="leftimg">
+				<img class="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至2022-10-21 00:00</div>
+			</div>
+			<div class="right">
+				<img class="img1" src="../../assets/images/leveladd/ma.png" />
+				<div class="line"></div>
+				<img class="img2" src="../../assets/images/leveladd/pub.png" />
+				<div class="pub">发布</div>
+				<div class="line"></div>
+				<img style="margin-right: 15px" class="img2" src="../../assets/images/leveladd/more.png" />
+				<div class="more">
+					<span style="color: #7096e3; cursor: pointer">更多</span>
+					<div class="moreArrow"></div>
+					<div class="moreItems">
+						<div class="sammo">撤回</div>
+						<div class="sammo">复制</div>
+					</div>
+				</div>
+				<div class="line"></div>
+				<router-link to="/projectmanage">
+					<div style="display: flex">
+						<img class="img2" src="../../assets/images/leveladd/back.png" />
+						<div class="return">返回</div>
+					</div>
+				</router-link>
+			</div>
+		</div>
+		<div class="split" style="flex-shrink: 0"></div>
+		<div class="content">
+			<a-tabs class="tab" v-model:activeKey="activeKey" size="large"
+				:tabBarStyle="{ marginLeft: '10px', marginTop: '5px' }">
+				<a-tab-pane key="1" tab="概览">
+					<div class="split"></div>
+					<!-- 概览（无数据） -->
+					<div>
+						<div class="onerow">
+							<div class="taskmain">快速创建项目详情</div>
+						</div>
+						<div class="second">
+							<div class="taskbox" style="background: linear-gradient(180deg, #fef3dd, #fffaf0)">
+								<div class="leftt">
+									<img src="../../assets/images/taskpage/left1.png" />
+								</div>
+								<div class="photo">
+									<img src="../../assets/images/taskpage/picture1.png" />
+								</div>
+								<div class="rightt">
+									<img src="../../assets/images/taskpage/right1.png" />
+								</div>
+								<div class="centerbox" style="color: rgba(255, 182, 78, 1)">
+									添加任务
+								</div>
+								<div class="centermain">快速添加任务/阶段</div>
+							</div>
+							<div class="taskbox" style="background: linear-gradient(180deg, #ddeaff, #f0f8fe)">
+								<div class="leftt">
+									<img src="../../assets/images/taskpage/left2.png" />
+								</div>
+								<div class="photo">
+									<img src="../../assets/images/taskpage/picture2.png" />
+								</div>
+								<div class="rightt">
+									<img src="../../assets/images/taskpage/right2.png" />
+								</div>
+								<div class="centerbox" style="color: rgba(78, 166, 255, 1)">
+									添加学员
+								</div>
+								<div class="centermain">快速添加学员</div>
+							</div>
+							<div class="taskbox" @click="showModal" style="background: linear-gradient(180deg, #e5f6ec, #eef9f3)">
+								<div class="leftt">
+									<img src="../../assets/images/taskpage/left3.png" />
+								</div>
+								<div class="photo">
+									<img src="../../assets/images/taskpage/picture3.png" />
+								</div>
+								<div class="rightt">
+									<img src="../../assets/images/taskpage/right3.png" />
+								</div>
+								<div class="centerbox" style="color: rgba(93, 201, 136, 1)">
+									发布
+								</div>
+								<div class="centermain">快速发布项目</div>
+							</div>
+						</div>
+					</div>
+					<!-- 概览（无数据） -->
+					<!-- 概览（有数据） -->
+					<div style="display: none">
+						<div class="onerow">
+							<div class="taskmain">项目概览</div>
+						</div>
+						<div class="second" style="margin-top: 0">
+							<div class="nubbox">
+								<span class="nub1">200</span>
+								<div class="nub2">总人数</div>
+							</div>
+							<div class="nubbox">
+								<span class="nub1" style="color: #ff90ae">15</span>
+								<div class="nub2">必修课</div>
+							</div>
+							<div class="nubbox">
+								<span class="nub1" style="color: #a497ff">15</span>
+								<div class="nub2">选修课</div>
+							</div>
+							<div class="nubbox">
+								<div>
+									<span class="nub1" style="color: #5dc988">50</span><span
+										style="color: #5dc988; font-size: 14px">%</span>
+								</div>
+								<div class="nub2">完成率</div>
+							</div>
+							<div class="nubbox">
+								<div>
+									<span class="nub1" style="color: #ff90ae">30</span><span
+										style="color: #ff90ae; font-size: 14px">%</span>
+								</div>
+								<div class="nub2">必修完成率</div>
+							</div>
+							<div class="nubbox">
+								<div>
+									<span class="nub1" style="color: #a497ff">30</span><span
+										style="color: #a497ff; font-size: 14px">%</span>
+								</div>
+								<div class="nub2">选修完成率</div>
+							</div>
+						</div>
+						<div class="onerow">
+							<div class="taskmain">阶段信息</div>
+						</div>
+						<div class="stagemess">
+							<div class="stage1">阶段1</div>
+							<div class="stage2">阶段2</div>
+						</div>
+						<div class="stagesecond">
+							<div class="staname">阶段名称：</div>
+							<div class="stamess">管理者进阶-腾飞班1第一阶段</div>
+						</div>
+						<div class="stagelast">
+							<div class="stagepro">
+								<a-progress type="dashboard" gapDegree="0" :percent="50" :width="140" />
+								<div class="protext">课程完成率</div>
+							</div>
+							<div class="stagepro">
+								<a-progress type="dashboard" gapDegree="0" :percent="50" :width="140" />
+								<div class="protext">考试通过率</div>
+							</div>
+							<div class="stagepro" style="margin-right: 0">
+								<a-progress type="dashboard" gapDegree="0" :percent="50" :width="140" />
+								<div class="protext">作业合格率</div>
+							</div>
+							<div class="proright">
+								<div class="pronub" style="margin-left: 280px">10</div>
+								<div class="proright1">
+									<span class="textpro">阶段任务总数</span>
+									<a-progress :percent="50" style="width: 369px" />
+								</div>
+								<div class="pronub" style="margin-left: 206px">5</div>
+								<div class="proright1">
+									<span class="textpro">必修课</span>
+									<a-progress :percent="25" style="width: 369px" />
+								</div>
+								<div class="pronub" style="margin-left: 142px">1</div>
+								<div class="proright1">
+									<span class="textpro">选修课</span>
+									<a-progress :percent="5" style="width: 369px" />
+								</div>
+							</div>
+						</div>
+					</div>
+					<!-- 概览（有数据） -->
+				</a-tab-pane>
+				<a-tab-pane key="2" tab="任务" force-render>
+					<div class="split"></div>
+					<div class="onerow">
+						<div class="taskmain">任务大纲</div>
+						<button class="btn">批量面授报名</button>
+						<router-link to="/taskadd" class="edit">
+							<img class="editimg" src="../../assets/images/projectadd/edit.png" />
+							<span class="editext">编辑</span>
+						</router-link>
+					</div>
+					<div class="stage">
+						<span class="stageimg"><img src="../../assets/images/projectadd/open.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" style="cursor: pointer" @click="showTime">
+								管理
+							</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" style="cursor: pointer">考勤</div>
+							<div class="operation" style="cursor: pointer">管理</div>
+							<div class="operation" style="cursor:pointer">二维码</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" style="cursor: pointer" @click="showFS">
+								学员
+							</div>
+							<div class="operation" style="cursor: pointer" @click="showFace">
+								管理
+							</div>
+							<div class="operation" style="cursor:pointer">二维码</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" style="cursor: pointer" @click="showAA">
+								考勤
+							</div>
+							<div class="operation" style="cursor: pointer">管理</div>
+							<div class="operation" style="cursor:pointer">二维码</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" style="cursor: pointer" @click="showWork">
+								管理
+							</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" style="cursor: pointer" @click="showTest">
+								管理
+							</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="学员">
+					<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="
+                      ">
+											<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="
+                      ">
+											<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="
+                      ">
+											<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="showStuAdd">
-                    <img src="../../assets/images/courseManage/add0.png" />
-                    <span class="btn1text">添加学员</span>
-                  </div>
-                  <div class="btn2" @click="showImportStu">
-                    <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" @click="showMemberList">
-                        <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" @click="showMemberList">
-                        <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" @click="showMemberList">
-                        <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" @click="showMemberList">
-                        <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="公告">
-          <div class="noticeTitle">
-            <h3>公告</h3>
-            <a-divider style="margin-top: -5px"></a-divider>
-            <a-switch
-              v-model:checked="noticeChecked"
-              style="size: small"
-            /><span style="margin-left: 13px">开启</span>
-            <p style="margin-top: 35px">公告内容</p>
-            <a-textarea
-              v-model:value="noticeContent"
-              show-count
-              :maxlength="150"
-              style="margin-top: -10px; height: 110px"
-            />
-            <div class="publish">
-              <div class="iconPub"></div>
-              <div class="btnText">发布</div>
-            </div>
-          </div>
-        </a-tab-pane>
-        <a-tab-pane key="5" tab="项目积分">Content of Tab Pane 3</a-tab-pane>
-        <a-tab-pane key="6" tab="排行榜">
-          <div class="content6">
-            <div class="title">排行榜</div>
-            <div class="line"></div>
-            <div class="search">
-              <div class="left">
-                <div class="name">
-                  <div class="text">姓名：</div>
-                  <a-input
-                    v-model:value="valueName"
-                    placeholder="请输入姓名"
-                    style="
+                      ">
+											<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="showStuAdd">
+										<img src="../../assets/images/courseManage/add0.png" />
+										<span class="btn1text">添加学员</span>
+									</div>
+									<div class="btn2" @click="showImportStu">
+										<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" @click="showMemberList">
+												<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" @click="showMemberList">
+												<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" @click="showMemberList">
+												<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" @click="showMemberList">
+												<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="公告">
+					<div class="noticeTitle">
+						<h3>公告</h3>
+						<a-divider style="margin-top: -5px"></a-divider>
+						<a-switch v-model:checked="noticeChecked" style="size: small" /><span style="margin-left: 13px">开启</span>
+						<p style="margin-top: 35px">公告内容</p>
+						<a-textarea v-model:value="noticeContent" show-count :maxlength="150"
+							style="margin-top: -10px; height: 110px" />
+						<div class="publish">
+							<div class="iconPub"></div>
+							<div class="btnText">发布</div>
+						</div>
+					</div>
+				</a-tab-pane>
+				<a-tab-pane key="5" tab="项目积分">Content of Tab Pane 3</a-tab-pane>
+				<a-tab-pane key="6" tab="排行榜">
+					<div class="content6">
+						<div class="title">排行榜</div>
+						<div class="line"></div>
+						<div class="search">
+							<div class="left">
+								<div class="name">
+									<div class="text">姓名：</div>
+									<a-input v-model:value="valueName" placeholder="请输入姓名" style="
                       width: 264px;
                       height: 40px;
                       border-radius: 8px;
                       margin-left: 5px;
-                    "
-                  />
-                </div>
-                <div class="time">
-                  <div class="text">选择时间：</div>
-                  <a-range-picker
-                    v-model:value="valueDate"
-                    style="border-radius: 8px; height: 40px; margin-left: 5px"
-                    :placeholder="['      开始时间', '        结束时间']"
-                  />
-                </div>
-              </div>
-              <div class="right">
-                <div class="btn btn1">
-                  <div class="img1"></div>
-                  <div class="te">搜索</div>
-                </div>
-                <div class="btn btn2">
-                  <div class="img2"></div>
-                  <div class="te">重置</div>
-                </div>
-              </div>
-            </div>
-            <div class="main">
-              <div class="rank">
-                <div class="rankhead">
-                  <div class="inhead">
-                    <div class="left">进度排行 Top10</div>
-                    <div class="right">
-                      <a-select
-                        v-model:value="valuestu1"
-                        style="width: 80px; margin-right: 16px"
-                        :options="rankjindu"
-                      ></a-select>
-                      <a-select
-                        v-model:value="valuestu2"
-                        style="width: 112px"
-                        :options="rankjieduan"
-                      ></a-select>
-                    </div>
-                  </div>
-                </div>
-                <div class="tab">
-                  <a-table
-                    :columns="jindutablecolumns"
-                    :data-source="jindutabledata"
-                    :loading="tableDataTotal === -1 ? true : false"
-                    expandRowByClick="true"
-                    :scroll="{ y: 330 }"
-                    @expand="expandTable"
-                    :pagination="false"
-                  />
-                </div>
-              </div>
-              <div class="rank">
-                <div class="rankhead">
-                  <div class="inhead">
-                    <div class="left">学分排行 Top10</div>
-                    <div class="right">
-                      <a-select
-                        v-model:value="valuestu3"
-                        style="width: 80px"
-                        :options="rankxuefen"
-                      ></a-select>
-                    </div>
-                  </div>
-                </div>
-                <div class="tab">
-                  <a-table
-                    :columns="xuefentablecolumns"
-                    :data-source="xuefentabledata"
-                    :loading="tableDataTotal === -1 ? true : false"
-                    expandRowByClick="true"
-                    :scroll="{ y: 330 }"
-                    @expand="expandTable"
-                    :pagination="false"
-                  />
-                </div>
-              </div>
-              <div class="rank">
-                <div class="rankhead">
-                  <div class="inhead">
-                    <div class="left">学识排行 Top10</div>
-                    <div class="right">
-                      <a-select
-                        v-model:value="valuestu4"
-                        style="width: 80px"
-                        :options="rankxueshi"
-                      ></a-select>
-                    </div>
-                  </div>
-                </div>
-                <div class="tab">
-                  <a-table
-                    :columns="xueshitablecolumns"
-                    :data-source="xueshitabledata"
-                    :loading="tableDataTotal === -1 ? true : false"
-                    expandRowByClick="true"
-                    :scroll="{ y: 330 }"
-                    @expand="expandTable"
-                    :pagination="false"
-                  />
-                </div>
-              </div>
-            </div>
-          </div>
-        </a-tab-pane>
-        <a-tab-pane key="7" tab="设置">
-          <div class="content7">
-            <div class="set_tit">
-              <span>基本信息</span>
-            </div>
-            <!-- <hr color="#E8E8E8" />
+                    " />
+								</div>
+								<div class="time">
+									<div class="text">选择时间：</div>
+									<a-range-picker v-model:value="valueDate" style="border-radius: 8px; height: 40px; margin-left: 5px"
+										:placeholder="['      开始时间', '        结束时间']" />
+								</div>
+							</div>
+							<div class="right">
+								<div class="btn btn1">
+									<div class="img1"></div>
+									<div class="te">搜索</div>
+								</div>
+								<div class="btn btn2">
+									<div class="img2"></div>
+									<div class="te">重置</div>
+								</div>
+							</div>
+						</div>
+						<div class="main">
+							<div class="rank">
+								<div class="rankhead">
+									<div class="inhead">
+										<div class="left">进度排行 Top10</div>
+										<div class="right">
+											<a-select v-model:value="valuestu1" style="width: 80px; margin-right: 16px" :options="rankjindu">
+											</a-select>
+											<a-select v-model:value="valuestu2" style="width: 112px" :options="rankjieduan"></a-select>
+										</div>
+									</div>
+								</div>
+								<div class="tab">
+									<a-table :columns="jindutablecolumns" :data-source="jindutabledata"
+										:loading="tableDataTotal === -1 ? true : false" expandRowByClick="true" :scroll="{ y: 330 }"
+										@expand="expandTable" :pagination="false" />
+								</div>
+							</div>
+							<div class="rank">
+								<div class="rankhead">
+									<div class="inhead">
+										<div class="left">学分排行 Top10</div>
+										<div class="right">
+											<a-select v-model:value="valuestu3" style="width: 80px" :options="rankxuefen"></a-select>
+										</div>
+									</div>
+								</div>
+								<div class="tab">
+									<a-table :columns="xuefentablecolumns" :data-source="xuefentabledata"
+										:loading="tableDataTotal === -1 ? true : false" expandRowByClick="true" :scroll="{ y: 330 }"
+										@expand="expandTable" :pagination="false" />
+								</div>
+							</div>
+							<div class="rank">
+								<div class="rankhead">
+									<div class="inhead">
+										<div class="left">学识排行 Top10</div>
+										<div class="right">
+											<a-select v-model:value="valuestu4" style="width: 80px" :options="rankxueshi"></a-select>
+										</div>
+									</div>
+								</div>
+								<div class="tab">
+									<a-table :columns="xueshitablecolumns" :data-source="xueshitabledata"
+										:loading="tableDataTotal === -1 ? true : false" expandRowByClick="true" :scroll="{ y: 330 }"
+										@expand="expandTable" :pagination="false" />
+								</div>
+							</div>
+						</div>
+					</div>
+				</a-tab-pane>
+				<a-tab-pane key="7" tab="设置">
+					<div class="content7">
+						<div class="set_tit">
+							<span>基本信息</span>
+						</div>
+						<!-- <hr color="#E8E8E8" />
              -->
-            <div class="line"></div>
-            <div class="set_body">
-              <div class="edit">
-                <div class="img"></div>
-                <div class="ed">编辑</div>
-              </div>
-              <div class="set_content">
-                <div class="setc_name"><span>项目名称：</span></div>
-                <div class="setc_main">
-                  <span style="color: #999999">管理者进阶 - 管理者腾飞班</span>
-                </div>
-              </div>
-              <div class="set_content">
-                <div class="setc_name"><span>封面图：</span></div>
-                <div class="setc_main">
-                  <img src="@/assets/images/projectadd/picture.png" alt="" />
-                </div>
-              </div>
-              <div class="set_content">
-                <div class="setc_name"><span>项目时间：</span></div>
-                <div class="setc_main">
-                  <span style="color: #999999"
-                    >2022-7-16 12:30 ～ 2022-7-30 12:30</span
-                  >
-                </div>
-              </div>
-              <div class="set_content">
-                <div class="setc_name"><span>项目经理：</span></div>
-                <div class="setc_main">
-                  <span style="color: #999999">张雪</span>
-                </div>
-              </div>
-              <div class="set_content">
-                <div class="setc_name"><span>资源归属：</span></div>
-                <div class="setc_main">
-                  <span style="color: #999999">-</span>
-                </div>
-              </div>
-              <div class="set_content">
-                <div class="setc_name"><span>项目说明：</span></div>
-                <div class="setc_main">
-                  <span style="color: #999999">-</span>
-                </div>
-              </div>
-              <div class="set_content">
-                <div class="setc_name"><span>同步学习记录：</span></div>
-                <div class="setc_main" @click="changecheck2">
-                  <a-radio v-model:checked="checkedd"
-                    ><span style="color: #333333"
-                      >同步课程学习记录（如学员在课程库中拥有课程的学习记录，自动免修该课程）</span
-                    ></a-radio
-                  >
-                </div>
-              </div>
-              <div class="set_content">
-                <div class="setc_name"><span>项目级别：</span></div>
-                <div class="setc_main">
-                  <span style="color: #999999">-</span>
-                </div>
-              </div>
-              <div class="set_content">
-                <div class="setc_name"><span>培训体系：</span></div>
-                <div class="setc_main">
-                  <span style="color: #999999">-</span>
-                </div>
-              </div>
-              <div class="set_content">
-                <div class="setc_name"><span>是否BOEU实施：</span></div>
-                <div class="setc_main" @click="changecheck3">
-                  <a-radio v-model:checked="checkedd2"
-                    ><span style="color: #333333">BOEU实施</span></a-radio
-                  >
-                </div>
-              </div>
-            </div>
-          </div>
-        </a-tab-pane>
-      </a-tabs>
-    </div>
-    <!-- 时间管理抽屉 -->
-    <time-manage v-model:Tvisible="visible" />
-    <!-- 面授管理抽屉 -->
-    <face-manage v-model:Fvisible="FaceVisivle" />
-    <!-- 学员（小组管理）创建小组抽屉 -->
-    <subset-manage v-model:Svisible="subsetVisivle" />
-    <!-- 学员管理-添加学员抽屉 -->
-    <stu-add v-model:Stuvisible="Stuvisible" />
-    <!-- 学员管理-导入学员抽屉 -->
-    <import-stu v-model:Importvisible="Importvisible" />
-    <!-- 查看学员 -->
-    <see-stu v-model:Seevisible="Seevisible" />
-     <!-- 学员换组 -->
-    <change-group v-model:Changevisible="Changevisible" />
-    <!-- 组员名单抽屉 -->
-    <member-list v-model:Lvisible="Lvisible" />
-    <!-- 面授学员抽屉 -->
-    <face-stu v-model:FSvisible="FSvisible" />
-    <!-- 活动考勤抽屉 -->
-    <active-attendance v-model:AAvisible="AAvisible" />
-    <!-- 作业管理抽屉 -->
-    <work-manage v-model:Wvisible="Wvisible" />
-    <!-- 考试管理抽屉 -->
-    <test-manage v-model:TMvisible="TMvisible" />
+						<div class="line"></div>
+						<div class="set_body">
+							<div class="edit">
+								<div class="img"></div>
+								<div class="ed">编辑</div>
+							</div>
+							<div class="set_content">
+								<div class="setc_name"><span>项目名称：</span></div>
+								<div class="setc_main">
+									<span style="color: #999999">管理者进阶 - 管理者腾飞班</span>
+								</div>
+							</div>
+							<div class="set_content">
+								<div class="setc_name"><span>封面图：</span></div>
+								<div class="setc_main">
+									<img src="@/assets/images/projectadd/picture.png" alt="" />
+								</div>
+							</div>
+							<div class="set_content">
+								<div class="setc_name"><span>项目时间：</span></div>
+								<div class="setc_main">
+									<span style="color: #999999">2022-7-16 12:30 ～ 2022-7-30 12:30</span>
+								</div>
+							</div>
+							<div class="set_content">
+								<div class="setc_name"><span>项目经理：</span></div>
+								<div class="setc_main">
+									<span style="color: #999999">张雪</span>
+								</div>
+							</div>
+							<div class="set_content">
+								<div class="setc_name"><span>资源归属：</span></div>
+								<div class="setc_main">
+									<span style="color: #999999">-</span>
+								</div>
+							</div>
+							<div class="set_content">
+								<div class="setc_name"><span>项目说明：</span></div>
+								<div class="setc_main">
+									<span style="color: #999999">-</span>
+								</div>
+							</div>
+							<div class="set_content">
+								<div class="setc_name"><span>同步学习记录：</span></div>
+								<div class="setc_main" @click="changecheck2">
+									<a-radio v-model:checked="checkedd"><span
+											style="color: #333333">同步课程学习记录（如学员在课程库中拥有课程的学习记录，自动免修该课程）</span></a-radio>
+								</div>
+							</div>
+							<div class="set_content">
+								<div class="setc_name"><span>项目级别：</span></div>
+								<div class="setc_main">
+									<span style="color: #999999">-</span>
+								</div>
+							</div>
+							<div class="set_content">
+								<div class="setc_name"><span>培训体系：</span></div>
+								<div class="setc_main">
+									<span style="color: #999999">-</span>
+								</div>
+							</div>
+							<div class="set_content">
+								<div class="setc_name"><span>是否BOEU实施：</span></div>
+								<div class="setc_main" @click="changecheck3">
+									<a-radio v-model:checked="checkedd2"><span style="color: #333333">BOEU实施</span></a-radio>
+								</div>
+							</div>
+						</div>
+					</div>
+				</a-tab-pane>
+			</a-tabs>
+		</div>
+		<!-- 时间管理抽屉 -->
+		<time-manage v-model:Tvisible="visible" />
+		<!-- 面授管理抽屉 -->
+		<face-manage v-model:Fvisible="FaceVisivle" />
+		<!-- 学员（小组管理）创建小组抽屉 -->
+		<subset-manage v-model:Svisible="subsetVisivle" />
+		<!-- 学员管理-添加学员抽屉 -->
+		<stu-add v-model:Stuvisible="Stuvisible" />
+		<!-- 学员管理-导入学员抽屉 -->
+		<import-stu v-model:Importvisible="Importvisible" />
+		<!-- 查看学员 -->
+		<see-stu v-model:Seevisible="Seevisible" />
+		<!-- 学员换组 -->
+		<change-group v-model:Changevisible="Changevisible" />
+		<!-- 组员名单抽屉 -->
+		<member-list v-model:Lvisible="Lvisible" />
+		<!-- 面授学员抽屉 -->
+		<face-stu v-model:FSvisible="FSvisible" />
+		<!-- 活动考勤抽屉 -->
+		<active-attendance v-model:AAvisible="AAvisible" />
+		<!-- 作业管理抽屉 -->
+		<work-manage v-model:Wvisible="Wvisible" />
+		<!-- 考试管理抽屉 -->
+		<test-manage v-model:TMvisible="TMvisible" />
 
-    <!-- 概览（无数据）-项目发布弹窗 -->
-    <div>
-      <a-modal
-        v-model:visible="pubproject"
-        :title="null"
-        @ok="closeModal"
-        :footer="null"
-        :closable="false"
-        wrapClassName="pubproject"
-        width="679px"
-        height="437px"
-      >
-        <div
-          class="modalHeader"
-          style="
+		<!-- 概览（无数据）-项目发布弹窗 -->
+		<div>
+			<a-modal v-model:visible="pubproject" :title="null" @ok="closeModal" :footer="null" :closable="false"
+				wrapClassName="pubproject" width="679px" height="437px">
+				<div class="modalHeader" style="
             width: 100%;
             height: 68px;
             display: flex;
             align-items: center;
             justify-content: space-between;
-          "
-        >
-          <div class="headerLeft" style="margin-left: 32px">
-            <span style="width: 15px; height: 15px"
-              ><img src="../../assets/images/taskpage/pub.png"
-            /></span>
-            <span
-              class="headerLeftText"
-              style="font-size: 16px; margin-left: 10px"
-              >项目发布</span
-            >
-          </div>
-          <div style="cursor: pointer; margin-right: 32px" @click="closeModal">
-            <img
-              style="width: 22px; height: 22px"
-              src="../../assets/images/basicinfo/close22.png"
-            />
-          </div>
-        </div>
-        <div class="modalMain">
-          <div class="projectname">管理者进阶-腾飞班1</div>
-          <div class="projecttime">
-            <span class="timeti">项目时间：</span
-            ><span class="timeme">2022/08/01-2022/08/30</span>
-          </div>
-          <div class="projectbox">
-            <div class="promessage">
-              <div class="messageme">项目信息</div>
-              <div class="messagege">当前项目共0个阶段，0个任务</div>
-            </div>
-            <div class="stumessage">
-              <div class="messageme1">学员信息</div>
-              <div class="messagege1">项目共0名学员</div>
-            </div>
-          </div>
-          <div class="send">
-            <a-switch v-model:checked="checked" size="small" />
-            <span class="sendtext">发送项目通知</span>
-          </div>
-          <div class="ckb">
-            <a-checkbox v-model:checked="checked1"
-              ><span class="sendpeo">发给老师</span></a-checkbox
-            >
-            <a-checkbox v-model:checked="checked2"
-              ><span class="sendpeo">发给学员</span></a-checkbox
-            >
-          </div>
-          <div class="pubtn">
-            <a-button class="pubtn1" @click="closeModal">取消</a-button>
-            <a-button class="pubtn2" @click="closeModal">发布</a-button>
-          </div>
-        </div>
-      </a-modal>
-    </div>
-    <!-- 概览（无数据）-项目发布弹窗 -->
-    <!-- 学员-创建小组弹窗 -->
-    <div>
-      <a-modal
-        v-model:visible="stugroup"
-        :title="null"
-        @ok="closeModal2"
-        :footer="null"
-        :closable="false"
-        wrapClassName="doublepro"
-        width="624px"
-        height="332px"
-      >
-        <div
-          class="modalHeader"
-          style="
+          ">
+					<div class="headerLeft" style="margin-left: 32px">
+						<span style="width: 15px; height: 15px"><img src="../../assets/images/taskpage/pub.png" /></span>
+						<span class="headerLeftText" style="font-size: 16px; margin-left: 10px">项目发布</span>
+					</div>
+					<div style="cursor: pointer; margin-right: 32px" @click="closeModal">
+						<img style="width: 22px; height: 22px" src="../../assets/images/basicinfo/close22.png" />
+					</div>
+				</div>
+				<div class="modalMain">
+					<div class="projectname">管理者进阶-腾飞班1</div>
+					<div class="projecttime">
+						<span class="timeti">项目时间：</span><span class="timeme">2022/08/01-2022/08/30</span>
+					</div>
+					<div class="projectbox">
+						<div class="promessage">
+							<div class="messageme">项目信息</div>
+							<div class="messagege">当前项目共0个阶段，0个任务</div>
+						</div>
+						<div class="stumessage">
+							<div class="messageme1">学员信息</div>
+							<div class="messagege1">项目共0名学员</div>
+						</div>
+					</div>
+					<div class="send">
+						<a-switch v-model:checked="checked" size="small" />
+						<span class="sendtext">发送项目通知</span>
+					</div>
+					<div class="ckb">
+						<a-checkbox v-model:checked="checked1"><span class="sendpeo">发给老师</span></a-checkbox>
+						<a-checkbox v-model:checked="checked2"><span class="sendpeo">发给学员</span></a-checkbox>
+					</div>
+					<div class="pubtn">
+						<a-button class="pubtn1" @click="closeModal">取消</a-button>
+						<a-button class="pubtn2" @click="closeModal">发布</a-button>
+					</div>
+				</div>
+			</a-modal>
+		</div>
+		<!-- 概览（无数据）-项目发布弹窗 -->
+		<!-- 学员-创建小组弹窗 -->
+		<div>
+			<a-modal v-model:visible="stugroup" :title="null" @ok="closeModal2" :footer="null" :closable="false"
+				wrapClassName="doublepro" width="624px" height="332px">
+				<div class="modalHeader" style="
             width: 100%;
             height: 68px;
             display: flex;
             align-items: center;
             justify-content: space-between;
             
-          "
-        >
-          <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">
-            <div class="star" style="margin-top: -4px">
-              <img
-                style="width: 10px; height: 10px"
-                src="../../assets/images/basicinfo/asterisk.png"
-              />
-            </div>
-            <div class="inname">小组名称:</div>
-            <div class="in">
-              <a-input
-                v-model:value="value"
-                placeholder="请输入小组名称"
-                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"
-                src="../../assets/images/basicinfo/asterisk.png"
-              />
-            </div>
-            <div class="inname">小组长:</div>
-            <div class="in">
-              <a-input
-                v-model:value="value"
-                placeholder="请输入小组长"
-                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>
-          </div>
-        </div>
-      </a-modal>
-    </div>
-    <!-- 学员-创建小组弹窗 -->
-    <!-- 取消学员弹窗 -->
-    <div>
-      <a-modal
-      v-model:visible="canclestu"
-      :footer="null"
-      :closable="close"
-      wrapClassName="canclestu"
-      centered="true"
-    >
-      <div class="delete">
-        <div class="del_header"></div>
-        <div class="del_main">
-          <div class="header">
-            <div class="icon"></div>
-            <span>提示</span>
-          </div>
-          <div class="body">
-            <span>您是否授予此学员优秀学员称号？</span>
-          </div>
-          <div class="del_btnbox">
-            <div class="del_btn btn1">
-              <div class="btnText" @click="closeModal1">取消</div>
-            </div>
-            <div class="del_btn btn2">
-              <div class="btnText" @click="closeModal1">确定</div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </a-modal>
-    </div>
-    <!-- 取消学员弹窗 -->
-  </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">
+						<div class="star" style="margin-top: -4px">
+							<img style="width: 10px; height: 10px" src="../../assets/images/basicinfo/asterisk.png" />
+						</div>
+						<div class="inname">小组名称:</div>
+						<div class="in">
+							<a-input v-model:value="value" placeholder="请输入小组名称" 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"
+								src="../../assets/images/basicinfo/asterisk.png" />
+						</div>
+						<div class="inname">小组长:</div>
+						<div class="in">
+							<a-input v-model:value="value" placeholder="请输入小组长" 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>
+					</div>
+				</div>
+			</a-modal>
+		</div>
+		<!-- 学员-创建小组弹窗 -->
+		<!-- 取消学员弹窗 -->
+		<div>
+			<a-modal v-model:visible="canclestu" :footer="null" :closable="close" wrapClassName="canclestu" centered="true">
+				<div class="delete">
+					<div class="del_header"></div>
+					<div class="del_main">
+						<div class="header">
+							<div class="icon"></div>
+							<span>提示</span>
+						</div>
+						<div class="body">
+							<span>您是否授予此学员优秀学员称号？</span>
+						</div>
+						<div class="del_btnbox">
+							<div class="del_btn btn1">
+								<div class="btnText" @click="closeModal1">取消</div>
+							</div>
+							<div class="del_btn btn2">
+								<div class="btnText" @click="closeModal1">确定</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</a-modal>
+		</div>
+		<!-- 取消学员弹窗 -->
+	</div>
 </template>
 <script>
 import { reactive, toRefs } from "vue";
@@ -1258,2036 +1001,2244 @@ import ImportStu from "../../components/drawers/ImportStu";
 import SeeStu from "../../components/drawers/SeeStu";
 import ChangeGroup from "../../components/drawers/ChangeGroup";
 export default {
-  name: "taskPage",
-  components: {
-    TimeManage,
-    FaceManage,
-    SubsetManage,
-    MemberList,
-    FaceStu,
-    ActiveAttendance,
-    WorkManage,
-    TestManage,
-    StuAdd,
-    ImportStu,
-    SeeStu,
-    ChangeGroup,
-  },
-  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",
-        },
-      ],
-      //进度排行学员
-      rankjindu: [{ value: "学员", label: "学员" }],
-      valuestu1: "学员",
-      //进度排行阶段
-      rankjieduan: [{ value: "第一阶段", label: "第一阶段" }],
-      valuestu2: "第一阶段",
-      //学分排行
-      rankxuefen: [{ value: "学员", label: "学员" }],
-      valuestu3: "学员",
-      //学识排行
-      rankxueshi: [{ value: "学员", label: "学员" }],
-      valuestu4: "学员",
-      visible: false, //时间管理
-      FaceVisivle: false, //面授管理
-      subsetVisivle: false, //随机小组
-      Lvisible: false, //组员名单
-      FSvisible: false, //面授学员
-      AAvisible: false, //活动考勤
-      Wvisible: false, //作业管理
-      TMvisible: false, //考试管理
-      Stuvisible: false, //添加学员
-      Importvisible: false, //导入学员
-      Seevisible: false, //查看学员
-      Changevisible: false, //学员换组
-      pubproject: false,
-      stugroup: false,
-      canclestu: false,
-      checked: false,
-      checked1: true,
-      checked2: false,
-      checkedd: false, //设置按钮1
-      checkedd2: false, //设置按钮2
-      activeKey: "1",
-      activeKey1: "8",
-      valueName: "", //排行榜输入姓名
-      valueDate: "", //排行榜输入日期
-      noticeChecked: true,
-      noticeContent: "请输入要发布的公告",
+	name: "taskPage",
+	components: {
+		TimeManage,
+		FaceManage,
+		SubsetManage,
+		MemberList,
+		FaceStu,
+		ActiveAttendance,
+		WorkManage,
+		TestManage,
+		StuAdd,
+		ImportStu,
+		SeeStu,
+		ChangeGroup,
+	},
+	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",
+				},
+			],
+			//进度排行学员
+			rankjindu: [{ value: "学员", label: "学员" }],
+			valuestu1: "学员",
+			//进度排行阶段
+			rankjieduan: [{ value: "第一阶段", label: "第一阶段" }],
+			valuestu2: "第一阶段",
+			//学分排行
+			rankxuefen: [{ value: "学员", label: "学员" }],
+			valuestu3: "学员",
+			//学识排行
+			rankxueshi: [{ value: "学员", label: "学员" }],
+			valuestu4: "学员",
+			visible: false, //时间管理
+			FaceVisivle: false, //面授管理
+			subsetVisivle: false, //随机小组
+			Lvisible: false, //组员名单
+			FSvisible: false, //面授学员
+			AAvisible: false, //活动考勤
+			Wvisible: false, //作业管理
+			TMvisible: false, //考试管理
+			Stuvisible: false, //添加学员
+			Importvisible: false, //导入学员
+			Seevisible: false, //查看学员
+			Changevisible: false, //学员换组
+			pubproject: false,
+			stugroup: false,
+			canclestu: false,
+			checked: false,
+			checked1: true,
+			checked2: false,
+			checkedd: false, //设置按钮1
+			checkedd2: false, //设置按钮2
+			activeKey: "1",
+			activeKey1: "8",
+			valueName: "", //排行榜输入姓名
+			valueDate: "", //排行榜输入日期
+			noticeChecked: true,
+			noticeContent: "请输入要发布的公告",
 
-      //进度排行表
-      jindutabledata: [
-        {
-          rank: "1",
-          name: "哈哈",
-          jd: "80%",
-        },
+			//进度排行表
+			jindutabledata: [
+				{
+					rank: "1",
+					name: "哈哈",
+					jd: "80%",
+				},
 
-        {
-          rank: "2",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "3",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "4",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "5",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "6",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "7",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "8",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "9",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "10",
-          name: "哈哈",
-          jd: "70%",
-        },
-      ],
-      jindutablecolumns: [
-        {
-          title: "排名",
-          dataIndex: "rank",
-          key: "rank",
-          width: 50,
-          align: "center",
-          className: "h",
-          customRender: (text) => {
-            if (text.record.rank == "1") {
-              return (
-                <img
-                  style={{ width: 24, height: 24 }}
-                  src={require("../../assets/images/taskpage/one.png")}
-                />
-              );
-            } else if (text.record.rank == "2") {
-              return (
-                <img
-                  style={{ width: 24, height: 24 }}
-                  src={require("../../assets/images/taskpage/two.png")}
-                />
-              );
-            } else if (text.record.rank == "3") {
-              return (
-                <img
-                  style={{ width: 24, height: 24 }}
-                  src={require("../../assets/images/taskpage/three.png")}
-                />
-              );
-            } else {
-              return <div>{text.record.rank}</div>;
-            }
-          },
-        },
-        {
-          title: "名称",
-          dataIndex: "name",
-          key: "name",
-          width: 50,
-          align: "center",
-          className: "h",
-        },
+				{
+					rank: "2",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "3",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "4",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "5",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "6",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "7",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "8",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "9",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "10",
+					name: "哈哈",
+					jd: "70%",
+				},
+			],
+			jindutablecolumns: [
+				{
+					title: "排名",
+					dataIndex: "rank",
+					key: "rank",
+					width: 50,
+					align: "center",
+					className: "h",
+					customRender: (text) => {
+						if (text.record.rank == "1") {
+							return (
+								<img
+									style={{ width: 24, height: 24 }}
+									src={require("../../assets/images/taskpage/one.png")}
+								/>
+							);
+						} else if (text.record.rank == "2") {
+							return (
+								<img
+									style={{ width: 24, height: 24 }}
+									src={require("../../assets/images/taskpage/two.png")}
+								/>
+							);
+						} else if (text.record.rank == "3") {
+							return (
+								<img
+									style={{ width: 24, height: 24 }}
+									src={require("../../assets/images/taskpage/three.png")}
+								/>
+							);
+						} else {
+							return <div>{text.record.rank}</div>;
+						}
+					},
+				},
+				{
+					title: "名称",
+					dataIndex: "name",
+					key: "name",
+					width: 50,
+					align: "center",
+					className: "h",
+				},
 
-        {
-          title: "进度",
-          dataIndex: "jd",
-          key: "jd",
-          width: 50,
-          align: "center",
-          className: "h",
-        },
-      ],
-      //学分排行表
-      xuefentabledata: [
-        {
-          rank: "1",
-          name: "哈哈",
-          jd: "80%",
-        },
+				{
+					title: "进度",
+					dataIndex: "jd",
+					key: "jd",
+					width: 50,
+					align: "center",
+					className: "h",
+				},
+			],
+			//学分排行表
+			xuefentabledata: [
+				{
+					rank: "1",
+					name: "哈哈",
+					jd: "80%",
+				},
 
-        {
-          rank: "2",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "3",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "4",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "5",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "6",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "7",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "8",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "9",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "10",
-          name: "哈哈",
-          jd: "70%",
-        },
-      ],
-      xuefentablecolumns: [
-        {
-          title: "排名",
-          dataIndex: "rank",
-          key: "rank",
-          width: 50,
-          align: "center",
-          className: "h",
-          customRender: (text) => {
-            if (text.record.rank == "1") {
-              return (
-                <img
-                  style={{ width: 24, height: 24 }}
-                  src={require("../../assets/images/taskpage/one.png")}
-                />
-              );
-            } else if (text.record.rank == "2") {
-              return (
-                <img
-                  style={{ width: 24, height: 24 }}
-                  src={require("../../assets/images/taskpage/two.png")}
-                />
-              );
-            } else if (text.record.rank == "3") {
-              return (
-                <img
-                  style={{ width: 24, height: 24 }}
-                  src={require("../../assets/images/taskpage/three.png")}
-                />
-              );
-            } else {
-              return <div>{text.record.rank}</div>;
-            }
-          },
-        },
-        {
-          title: "名称",
-          dataIndex: "name",
-          key: "name",
-          width: 50,
-          align: "center",
-          className: "h",
-        },
+				{
+					rank: "2",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "3",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "4",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "5",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "6",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "7",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "8",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "9",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "10",
+					name: "哈哈",
+					jd: "70%",
+				},
+			],
+			xuefentablecolumns: [
+				{
+					title: "排名",
+					dataIndex: "rank",
+					key: "rank",
+					width: 50,
+					align: "center",
+					className: "h",
+					customRender: (text) => {
+						if (text.record.rank == "1") {
+							return (
+								<img
+									style={{ width: 24, height: 24 }}
+									src={require("../../assets/images/taskpage/one.png")}
+								/>
+							);
+						} else if (text.record.rank == "2") {
+							return (
+								<img
+									style={{ width: 24, height: 24 }}
+									src={require("../../assets/images/taskpage/two.png")}
+								/>
+							);
+						} else if (text.record.rank == "3") {
+							return (
+								<img
+									style={{ width: 24, height: 24 }}
+									src={require("../../assets/images/taskpage/three.png")}
+								/>
+							);
+						} else {
+							return <div>{text.record.rank}</div>;
+						}
+					},
+				},
+				{
+					title: "名称",
+					dataIndex: "name",
+					key: "name",
+					width: 50,
+					align: "center",
+					className: "h",
+				},
 
-        {
-          title: "进度",
-          dataIndex: "jd",
-          key: "jd",
-          width: 50,
-          align: "center",
-          className: "h",
-        },
-      ],
-      //学识排行表
-      xueshitabledata: [
-        {
-          rank: "1",
-          name: "哈哈",
-          jd: "80%",
-        },
+				{
+					title: "进度",
+					dataIndex: "jd",
+					key: "jd",
+					width: 50,
+					align: "center",
+					className: "h",
+				},
+			],
+			//学识排行表
+			xueshitabledata: [
+				{
+					rank: "1",
+					name: "哈哈",
+					jd: "80%",
+				},
 
-        {
-          rank: "2",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "3",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "4",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "5",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "6",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "7",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "8",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "9",
-          name: "哈哈",
-          jd: "70%",
-        },
-        {
-          rank: "10",
-          name: "哈哈",
-          jd: "70%",
-        },
-      ],
-      xueshitablecolumns: [
-        {
-          title: "排名",
-          dataIndex: "rank",
-          key: "rank",
-          width: 50,
-          align: "center",
-          className: "h",
-          customRender: (text) => {
-            if (text.record.rank == "1") {
-              return (
-                <img
-                  style={{ width: 24, height: 24 }}
-                  src={require("../../assets/images/taskpage/one.png")}
-                />
-              );
-            } else if (text.record.rank == "2") {
-              return (
-                <img
-                  style={{ width: 24, height: 24 }}
-                  src={require("../../assets/images/taskpage/two.png")}
-                />
-              );
-            } else if (text.record.rank == "3") {
-              return (
-                <img
-                  style={{ width: 24, height: 24 }}
-                  src={require("../../assets/images/taskpage/three.png")}
-                />
-              );
-            } else {
-              return <div>{text.record.rank}</div>;
-            }
-          },
-        },
-        {
-          title: "名称",
-          dataIndex: "name",
-          key: "name",
-          width: 50,
-          align: "center",
-          className: "h",
-        },
+				{
+					rank: "2",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "3",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "4",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "5",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "6",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "7",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "8",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "9",
+					name: "哈哈",
+					jd: "70%",
+				},
+				{
+					rank: "10",
+					name: "哈哈",
+					jd: "70%",
+				},
+			],
+			xueshitablecolumns: [
+				{
+					title: "排名",
+					dataIndex: "rank",
+					key: "rank",
+					width: 50,
+					align: "center",
+					className: "h",
+					customRender: (text) => {
+						if (text.record.rank == "1") {
+							return (
+								<img
+									style={{ width: 24, height: 24 }}
+									src={require("../../assets/images/taskpage/one.png")}
+								/>
+							);
+						} else if (text.record.rank == "2") {
+							return (
+								<img
+									style={{ width: 24, height: 24 }}
+									src={require("../../assets/images/taskpage/two.png")}
+								/>
+							);
+						} else if (text.record.rank == "3") {
+							return (
+								<img
+									style={{ width: 24, height: 24 }}
+									src={require("../../assets/images/taskpage/three.png")}
+								/>
+							);
+						} else {
+							return <div>{text.record.rank}</div>;
+						}
+					},
+				},
+				{
+					title: "名称",
+					dataIndex: "name",
+					key: "name",
+					width: 50,
+					align: "center",
+					className: "h",
+				},
 
-        {
-          title: "进度",
-          dataIndex: "jd",
-          key: "jd",
-          width: 50,
-          align: "center",
-          className: "h",
-        },
-      ],
-    });
-    const showModal = () => {
-      state.pubproject = true;
-    };
-    const closeModal = () => {
-      state.pubproject = false;
-    };
-    const showModal1 = () => {
-      state.canclestu = true;
-    };
-    const closeModal1 = () => {
-      state.canclestu = false;
-    };
-    const showModal2 = () => {
-      state.stugroup = true;
-    };
-    const closeModal2 = () => {
-      state.stugroup = false;
-    };
-    //新增
-    const showTime = () => {
-      console.log("点击管理");
-      state.visible = true;
-    };
-    //新增
-    const showFace = () => {
-      //面授管理的抽屉
-      // console.log("点击管理");
-      state.FaceVisivle = true;
-    };
-    const showSubset = () => {
-      //面授管理的抽屉
-      // console.log("点击管理");
-      state.subsetVisivle = true;
-    };
-    //面授学员的弹窗
-    const showFS = () => {
-      state.FSvisible = true;
-    };
-    //面授学员的弹窗
-    const showMemberList = () => {
-      state.Lvisible = true;
-    };
-    //活动考勤的抽屉
-    const showAA = () => {
-      state.AAvisible = true;
-    };
-    //作业管理的抽屉
-    const showWork = () => {
-      state.Wvisible = true;
-    };
-    //考试管理的抽屉
-    const showTest = () => {
-      state.TMvisible = true;
-    };
-    const showStuAdd = () => {
-      state.Stuvisible = true;
-    };
-    const showSeeStu = () => {
-      state.Seevisible = true;
-    };
-    const showImportStu = () => {
-      state.Importvisible = true;
-    };
-    const showChangeGroup = () => {
-      state.Changevisible = true;
-    };
-    const changecheck2 = () => {
-      state.checkedd = !state.checkedd;
-    };
-    const changecheck3 = () => {
-      state.checkedd2 = !state.checkedd2;
-    };
-    return {
-      ...toRefs(state),
-      showModal,
-      closeModal,
-      showModal1,
-      closeModal1,
-      showModal2,
-      closeModal2,
-      showTime,
-      showFace,
-      showSubset,
-      showMemberList,
-      showFS,
-      showAA,
-      showWork,
-      showTest,
-      changecheck2,
-      changecheck3,
-      showStuAdd,
-      showImportStu,
-      showSeeStu,
-      showChangeGroup,
-    };
-  },
+				{
+					title: "进度",
+					dataIndex: "jd",
+					key: "jd",
+					width: 50,
+					align: "center",
+					className: "h",
+				},
+			],
+		});
+		const showModal = () => {
+			state.pubproject = true;
+		};
+		const closeModal = () => {
+			state.pubproject = false;
+		};
+		const showModal1 = () => {
+			state.canclestu = true;
+		};
+		const closeModal1 = () => {
+			state.canclestu = false;
+		};
+		const showModal2 = () => {
+			state.stugroup = true;
+		};
+		const closeModal2 = () => {
+			state.stugroup = false;
+		};
+		//新增
+		const showTime = () => {
+			console.log("点击管理");
+			state.visible = true;
+		};
+		//新增
+		const showFace = () => {
+			//面授管理的抽屉
+			// console.log("点击管理");
+			state.FaceVisivle = true;
+		};
+		const showSubset = () => {
+			//面授管理的抽屉
+			// console.log("点击管理");
+			state.subsetVisivle = true;
+		};
+		//面授学员的弹窗
+		const showFS = () => {
+			state.FSvisible = true;
+		};
+		//面授学员的弹窗
+		const showMemberList = () => {
+			state.Lvisible = true;
+		};
+		//活动考勤的抽屉
+		const showAA = () => {
+			state.AAvisible = true;
+		};
+		//作业管理的抽屉
+		const showWork = () => {
+			state.Wvisible = true;
+		};
+		//考试管理的抽屉
+		const showTest = () => {
+			state.TMvisible = true;
+		};
+		const showStuAdd = () => {
+			state.Stuvisible = true;
+		};
+		const showSeeStu = () => {
+			state.Seevisible = true;
+		};
+		const showImportStu = () => {
+			state.Importvisible = true;
+		};
+		const showChangeGroup = () => {
+			state.Changevisible = true;
+		};
+		const changecheck2 = () => {
+			state.checkedd = !state.checkedd;
+		};
+		const changecheck3 = () => {
+			state.checkedd2 = !state.checkedd2;
+		};
+		return {
+			...toRefs(state),
+			showModal,
+			closeModal,
+			showModal1,
+			closeModal1,
+			showModal2,
+			closeModal2,
+			showTime,
+			showFace,
+			showSubset,
+			showMemberList,
+			showFS,
+			showAA,
+			showWork,
+			showTest,
+			changecheck2,
+			changecheck3,
+			showStuAdd,
+			showImportStu,
+			showSeeStu,
+			showChangeGroup,
+		};
+	},
 };
 </script>
 <style lang="scss">
 .clearfix:before,
 .clearfix:after {
-  content: " ";
-  display: table;
-  clear: both;
+	content: " ";
+	display: table;
+	clear: both;
 }
+
 .pubproject {
-  .ant-modal {
-    .ant-modal-body {
-      .modalHeader {
-        background: linear-gradient(
-          rgba(78, 166, 255, 0.2) 0%,
-          rgba(78, 166, 255, 0) 100%
-        );
-      }
-      padding: 0;
-      .modalHeader {
-        background: linear-gradient(
-          0deg,
-          rgba(78, 166, 255, 0) 0%,
-          rgba(78, 166, 255, 0.2) 100%
-        );
-      }
-      .modalMain {
-        .projectname {
-          color: rgba(79, 81, 86, 1);
-          font-size: 14px;
-          line-height: 36px;
-          margin-left: 62px;
-          font-weight: 500;
-        }
-        .projecttime {
-          margin-left: 221px;
-          .timeti {
-            color: rgba(153, 155, 163, 1);
-            font-size: 14px;
-            line-height: 36px;
-          }
-          .timeme {
-            color: rgba(79, 81, 86, 1);
-            font-size: 14px;
-            line-height: 36px;
-          }
-        }
-        .projectbox {
-          margin-top: 26px;
-          display: flex;
-          justify-content: center;
-          .promessage {
-            width: 280px;
-            height: 110px;
-            background: linear-gradient(
-              180deg,
-              rgba(254, 243, 221, 1),
-              rgba(255, 250, 240, 1)
-            );
-            border-radius: 10px;
-            margin-right: 7px;
-            .messageme {
-              color: rgba(255, 182, 78, 1);
-              font-size: 14px;
-              line-height: 36px;
-              margin-top: 17px;
-              margin-left: 30px;
-            }
-            .messagege {
-              color: rgba(153, 155, 163, 1);
-              font-size: 14px;
-              margin-left: 30px;
-            }
-          }
-          .stumessage {
-            width: 280px;
-            height: 110px;
-            background: linear-gradient(
-              180deg,
-              rgba(221, 234, 255, 1),
-              rgba(240, 248, 254, 1)
-            );
-            border-radius: 10px;
-            .messageme1 {
-              color: rgba(78, 166, 255, 1);
-              font-size: 14px;
-              line-height: 36px;
-              margin-top: 17px;
-              margin-left: 30px;
-            }
-            .messagege1 {
-              color: rgba(153, 155, 163, 1);
-              font-size: 14px;
-              margin-left: 30px;
-            }
-          }
-        }
-        .send {
-          margin-top: 30px;
-          margin-left: 61px;
-          .sendtext {
-            margin-left: 11px;
-            color: rgba(109, 117, 132, 1);
-            font-size: 14px;
-          }
-        }
-        .ckb {
-          margin-top: 20px;
-          margin-left: 62px;
-          .sendpeo {
-            color: rgba(109, 117, 132, 1);
-            font-size: 14px;
-          }
-          .ant-checkbox-inner {
-            border-radius: 4px;
-          }
-        }
-        .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;
-          }
-        }
-      }
-    }
-  }
+	.ant-modal {
+		.ant-modal-body {
+			.modalHeader {
+				background: linear-gradient(rgba(78, 166, 255, 0.2) 0%,
+						rgba(78, 166, 255, 0) 100%);
+			}
+
+			padding: 0;
+
+			.modalHeader {
+				background: linear-gradient(0deg,
+						rgba(78, 166, 255, 0) 0%,
+						rgba(78, 166, 255, 0.2) 100%);
+			}
+
+			.modalMain {
+				.projectname {
+					color: rgba(79, 81, 86, 1);
+					font-size: 14px;
+					line-height: 36px;
+					margin-left: 62px;
+					font-weight: 500;
+				}
+
+				.projecttime {
+					margin-left: 221px;
+
+					.timeti {
+						color: rgba(153, 155, 163, 1);
+						font-size: 14px;
+						line-height: 36px;
+					}
+
+					.timeme {
+						color: rgba(79, 81, 86, 1);
+						font-size: 14px;
+						line-height: 36px;
+					}
+				}
+
+				.projectbox {
+					margin-top: 26px;
+					display: flex;
+					justify-content: center;
+
+					.promessage {
+						width: 280px;
+						height: 110px;
+						background: linear-gradient(180deg,
+								rgba(254, 243, 221, 1),
+								rgba(255, 250, 240, 1));
+						border-radius: 10px;
+						margin-right: 7px;
+
+						.messageme {
+							color: rgba(255, 182, 78, 1);
+							font-size: 14px;
+							line-height: 36px;
+							margin-top: 17px;
+							margin-left: 30px;
+						}
+
+						.messagege {
+							color: rgba(153, 155, 163, 1);
+							font-size: 14px;
+							margin-left: 30px;
+						}
+					}
+
+					.stumessage {
+						width: 280px;
+						height: 110px;
+						background: linear-gradient(180deg,
+								rgba(221, 234, 255, 1),
+								rgba(240, 248, 254, 1));
+						border-radius: 10px;
+
+						.messageme1 {
+							color: rgba(78, 166, 255, 1);
+							font-size: 14px;
+							line-height: 36px;
+							margin-top: 17px;
+							margin-left: 30px;
+						}
+
+						.messagege1 {
+							color: rgba(153, 155, 163, 1);
+							font-size: 14px;
+							margin-left: 30px;
+						}
+					}
+				}
+
+				.send {
+					margin-top: 30px;
+					margin-left: 61px;
+
+					.sendtext {
+						margin-left: 11px;
+						color: rgba(109, 117, 132, 1);
+						font-size: 14px;
+					}
+				}
+
+				.ckb {
+					margin-top: 20px;
+					margin-left: 62px;
+
+					.sendpeo {
+						color: rgba(109, 117, 132, 1);
+						font-size: 14px;
+					}
+
+					.ant-checkbox-inner {
+						border-radius: 4px;
+					}
+				}
+
+				.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;
+					}
+				}
+			}
+		}
+	}
 }
+
 .canclestu {
-  .ant-modal {
-    width: 424px !important;
-    height: 258px !important;
-    .ant-modal-content {
-      width: 424px !important;
-      height: 258px !important;
-      .ant-modal-close {
-          margin-right: 18px;
-          margin-top: 5px;
-        }
-      .ant-modal-body {
-        width: 424px !important;
-        height: 258px !important;
-        padding: 0 !important;
-        
-        .delete {
-          z-index: 999;
-          width: 424px;
-          height: 258px;
-          background: #ffffff;
-          box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
-          border-radius: 4px;
-          // position: absolute;
-          // left: 50%;
-          // top: 10%;
-          // transform: translate(-50%, -50%);
-          .del_header {
-            position: absolute;
-            width: calc(100%);
-            height: 68px;
-            background: linear-gradient(
-              rgba(78, 166, 255, 0.2) 0%,
-              rgba(78, 166, 255, 0) 100%
-            );
-          }
-          .del_main {
-            width: 100%;
-            position: relative;
-            .header {
-              display: flex;
-              align-items: center;
-              padding-top: 20px;
-              padding-left: 26px;
-              font-size: 16px;
-              .icon {
-                width: 16px;
-                height: 16px;
-                margin-right: 10px;
-                background-image: url(@/assets/images/coursewareManage/notice.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%;
-              }
-            }
-            .body {
-              width: 100%;
-              margin: 34px auto 56px auto;
-              display: flex;
-              justify-content: center;
-              align-items: center;
-              flex-direction: column;
-              // background-color: red;
-              position: relative;
-              .back {
-                position: absolute;
-                top: 30px;
-                font-size: 12px;
-                font-weight: 400;
-                color: #666666;
-              }
-            }
-            .del_btnbox {
-              display: flex;
-              margin: 30px auto;
-              justify-content: center;
-              .del_btn {
-                width: 100px;
-                height: 40px;
-                background: rgba(64, 158, 255, 0);
-                border-radius: 8px;
-                display: flex;
-                align-items: center;
-                justify-content: center;
+	.ant-modal {
+		width: 424px !important;
+		height: 258px !important;
 
-                flex-shrink: 0;
-                cursor: pointer;
-                .btnText {
-                  font-size: 14px;
-                  font-weight: 400;
-                  line-height: 40px;
-                }
-              }
-              .btn1 {
-                border: 1px solid rgba(64, 158, 255, 1);
-                color: #4ea6ff;
-                margin-right: 14px;
-              }
-              .btn2 {
-                background-color: #4ea6ff;
-                color: #ffffff;
-              }
-            }
-          }
-        }
-      }
-    }
-  }
+		.ant-modal-content {
+			width: 424px !important;
+			height: 258px !important;
+
+			.ant-modal-close {
+				margin-right: 18px;
+				margin-top: 5px;
+			}
+
+			.ant-modal-body {
+				width: 424px !important;
+				height: 258px !important;
+				padding: 0 !important;
+
+				.delete {
+					z-index: 999;
+					width: 424px;
+					height: 258px;
+					background: #ffffff;
+					box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
+					border-radius: 4px;
+
+					// position: absolute;
+					// left: 50%;
+					// top: 10%;
+					// transform: translate(-50%, -50%);
+					.del_header {
+						position: absolute;
+						width: calc(100%);
+						height: 68px;
+						background: linear-gradient(rgba(78, 166, 255, 0.2) 0%,
+								rgba(78, 166, 255, 0) 100%);
+					}
+
+					.del_main {
+						width: 100%;
+						position: relative;
+
+						.header {
+							display: flex;
+							align-items: center;
+							padding-top: 20px;
+							padding-left: 26px;
+							font-size: 16px;
+
+							.icon {
+								width: 16px;
+								height: 16px;
+								margin-right: 10px;
+								background-image: url(@/assets/images/coursewareManage/notice.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%;
+							}
+						}
+
+						.body {
+							width: 100%;
+							margin: 34px auto 56px auto;
+							display: flex;
+							justify-content: center;
+							align-items: center;
+							flex-direction: column;
+							// background-color: red;
+							position: relative;
+
+							.back {
+								position: absolute;
+								top: 30px;
+								font-size: 12px;
+								font-weight: 400;
+								color: #666666;
+							}
+						}
+
+						.del_btnbox {
+							display: flex;
+							margin: 30px auto;
+							justify-content: center;
+
+							.del_btn {
+								width: 100px;
+								height: 40px;
+								background: rgba(64, 158, 255, 0);
+								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;
+								}
+							}
+
+							.btn1 {
+								border: 1px solid rgba(64, 158, 255, 1);
+								color: #4ea6ff;
+								margin-right: 14px;
+							}
+
+							.btn2 {
+								background-color: #4ea6ff;
+								color: #ffffff;
+							}
+						}
+					}
+				}
+			}
+		}
+	}
 }
+
 .doublepro {
-  .ant-modal {
-    .ant-modal-body {
-      .modalHeader {
-        background: linear-gradient(
-              0deg,
-              rgba(78, 166, 255, 0) 0%,
-              rgba(78, 166, 255, 0.2) 100%
-            );
-      }
-      padding: 0;
-      .modalMain {
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        .name {
-          width: 78%;
-          // background-color: lightcoral;
-          display: flex;
-          justify-content: right;
-          margin-top: 32px;
-          align-items: center;
-          height: 40px;
-          // border: 1px solid black;
+	.ant-modal {
+		.ant-modal-body {
+			.modalHeader {
+				background: linear-gradient(0deg,
+						rgba(78, 166, 255, 0) 0%,
+						rgba(78, 166, 255, 0.2) 100%);
+			}
 
-          .inname {
-            color: #000000;
-            font-size: 14px;
-            margin-left: 7px;
-          }
-          .in {
-            margin-left: 14px;
-            width: 81%;
-            .ant-input {
-              border-radius: 5px;
-              // height: 120%;
-              width: 100%;
-              height: 30px;
-            }
-            .ant-select {
-              border-radius: 5px;
-              // height: 120%;
-              width: 100%;
-              height: 40px;
-              .ant-select-selector {
-                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;
-          }
-        }
-      }
-    }
-  }
+			padding: 0;
+
+			.modalMain {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+
+				.name {
+					width: 78%;
+					// background-color: lightcoral;
+					display: flex;
+					justify-content: right;
+					margin-top: 32px;
+					align-items: center;
+					height: 40px;
+					// border: 1px solid black;
+
+					.inname {
+						color: #000000;
+						font-size: 14px;
+						margin-left: 7px;
+					}
+
+					.in {
+						margin-left: 14px;
+						width: 81%;
+
+						.ant-input {
+							border-radius: 5px;
+							// height: 120%;
+							width: 100%;
+							height: 30px;
+						}
+
+						.ant-select {
+							border-radius: 5px;
+							// height: 120%;
+							width: 100%;
+							height: 40px;
+
+							.ant-select-selector {
+								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;
+					}
+				}
+			}
+		}
+	}
 }
+
 .taskpage {
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  //position: relative;
-  .addhead {
-    width: 100%;
-    height: 130px;
-    // background-color: lightgreen;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    position: relative;
-    .leftimg {
-      width: 151px;
-      height: 100px;
-      border: 10px solid #e7f2ff;
-      border-radius: 8px;
-      margin-left: 20px;
-      .img {
-        width: 100%;
-        height: 100%;
-      }
-    }
-    .imgfor {
-      margin-left: 32px;
-      display: flex;
-      flex: 1;
-      flex-direction: column;
-      .forz {
-        color: #363636;
-        font-weight: 600;
-        font-size: 16px;
-      }
-      .fort {
-        display: flex;
-        flex-wrap: wrap;
-        color: #878b92;
-        font-size: 14px;
-        margin-top: 2px;
-      }
-    }
-    @media screen and (max-width: 1030px) {
-      .imgfor {
-        margin-left: 20px;
-      }
-    }
-    .right {
-      // width: 500px;
-      height: 100%;
-      // background-color: red;
-      //position: absolute;
-      //right: 0;
-      display: flex;
-      align-items: center;
-      .img1 {
-        width: 24px;
-        height: 24px;
-        margin-right: 50px;
-      }
-      .line {
-        height: 65%;
-        width: 1px;
-        background-color: #e8effa;
-        margin-right: 28px;
-      }
-      .img2 {
-        width: 42px;
-        height: 42px;
-        margin-right: 22px;
-      }
-      .pub {
-        color: #ffb64e;
-        font-size: 14px;
-        margin-top: 5px;
-        margin-right: 30px;
-        cursor: pointer;
-      }
-      .return {
-        color: #4ea6ff;
-        font-size: 14px;
-        margin-top: 10px;
-        margin-right: 60px;
-      }
-      .more {
-        position: relative;
-        margin-right: 30px;
-        height: 30px;
-        display: flex;
-        align-items: center;
-        .moreArrow {
-          width: 13px;
-          height: 7px;
-          display: inline-block;
-          background-image: url("../../assets/images/navtop/down.png");
-          background-size: 100%;
-          margin: 2px;
-          margin-left: 15px;
-        }
-        .moreItems {
-          width: 110px;
-          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;
-      }
-    }
-  }
-  .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;
-    .ant-tabs-nav-wrap {
-      margin-left: 30px;
-    }
-    .onerow {
-      //width: 100%;
-      display: flex;
-      height: 40px;
-      position: relative;
-      margin-top: 15px;
-      margin-left: 38px;
-      //margin-right: 38px;
-      .taskmain {
-        font-size: 18px;
-        padding-top: 7px;
-        color: #000000;
-      }
-      .btn {
-        position: absolute;
-        top: 0;
-        right: 168px;
-        background-color: #409eff;
-        width: 130px;
-        height: 40px;
-        border-radius: 8px;
-        border: 1px solid #409eff;
-        color: #ffffff;
-        cursor: pointer;
-      }
-      .edit {
-        position: absolute;
-        right: 48px;
-        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");
-        }
-      }
-    }
-    .second {
-      display: flex;
-      justify-content: left;
-      flex-wrap: wrap;
-      margin-top: 40px;
-      margin-left: 20px;
-      .nubbox {
-        width: 253px;
-        height: 116px;
-        margin-top: 20px;
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-        align-items: center;
-        background: #fafbfc;
-        border-radius: 10px;
-        margin-left: 15px;
-        .nub1 {
-          color: #ffb54a;
-          font-size: 30px;
-          font-weight: 700;
-        }
-        .nub2 {
-          color: #6d7584;
-          font-size: 14px;
-        }
-      }
-      .taskbox {
-        width: 412px;
-        height: 160px;
-        border-radius: 10px;
-        position: relative;
-        margin-left: 68px;
-        margin-bottom: 40px;
-        cursor: pointer;
-        .leftt {
-          position: absolute;
-          top: 18px;
-          left: 0;
-        }
-        .photo {
-          position: absolute;
-          top: 42px;
-          left: 37px;
-        }
-        .rightt {
-          position: absolute;
-          top: 69px;
-          right: 26px;
-        }
-        .centerbox {
-          position: absolute;
-          top: 52px;
-          left: 145px;
-          font-size: 20px;
-          font-weight: 700;
-          //line-height: 36px;
-        }
-        .centermain {
-          color: rgba(135, 139, 146, 1);
-          font-size: 14px;
-          position: absolute;
-          left: 144px;
-          bottom: 49px;
-        }
-      }
-    }
-    .stagemess {
-      display: flex;
-      margin-left: 38px;
-      .stage1 {
-        width: 100px;
-        height: 33px;
-        text-align: center;
-        line-height: 34px;
-        border-radius: 6px;
-        color: #ffffff;
-        font-size: 16px;
-        background: #4ea6ff;
-        margin-right: 10px;
-        margin-top: 19px;
-        cursor: pointer;
-      }
-      .stage2 {
-        width: 100px;
-        height: 33px;
-        text-align: center;
-        line-height: 34px;
-        border-radius: 6px;
-        border: 1px solid #ebeef3;
-        color: #000000;
-        font-size: 16px;
-        background: #ffffff;
-        margin-right: 10px;
-        margin-top: 19px;
-        cursor: pointer;
-      }
-    }
-    .stagesecond {
-      display: flex;
-      margin-left: 39px;
-      margin-top: 29px;
-      .staname {
-        color: #999ba3;
-        font-size: 14px;
-      }
-      .stamess {
-        color: #4f5156;
-        font-size: 14px;
-      }
-    }
-    .stagelast {
-      display: flex;
-      flex-wrap: wrap;
-      justify-content: center;
-      margin-bottom: 55px;
-      .stagepro {
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        margin-top: 55px;
-        margin-right: 120px;
-        .ant-progress-circle-path {
-          stroke: #4ea6ff;
-        }
-        .ant-progress-text {
-          color: #4ea6ff;
-          font-weight: 700;
-        }
-        .protext {
-          color: #6d7584;
-          font-size: 14px;
-          margin-top: 25px;
-        }
-      }
-      .proright {
-        width: 500px;
-        margin-top: 55px;
-        margin-left: 50px;
-        .ant-progress-bg {
-          height: 24px !important;
-          background: #4ea6ff;
-        }
-        .ant-progress-inner {
-          height: 24px;
-        }
-        .pronub {
-          color: #4ea6ff;
-          font-size: 14px;
-          margin: 5px 0;
-        }
-        .proright1 {
-          display: flex;
-          justify-content: right;
-          .textpro {
-            color: #6d7584;
-            font-size: 14px;
-            margin-right: 20px;
-          }
-          .ant-progress-text {
-            color: #4ea6ff;
-            font-size: 14px;
-            font-weight: 700;
-          }
-        }
-      }
-    }
-    .stage {
-      display: flex;
-      height: 49px;
-      background-color: #eff4fc;
-      align-items: center;
-      margin-top: 20px;
-      margin-left: 38px;
-      margin-right: 38px;
-      .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-left: 38px;
-      margin-right: 38px;
-      //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;
+	width: 100%;
+	display: flex;
+	flex-direction: column;
 
-        .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-left: 10px;
-        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;
-        }
-      }
-    }
-    .noticeTitle {
-      margin-left: 38px;
-      margin-right: 38px;
-      padding-top: 20px;
-      .publish {
-        width: 100px;
-        // padding: 0px 26px 0px 26px;
-        height: 38px;
-        background: rgb(64, 158, 255);
-        border-radius: 8px;
-        border: 1px solid rgba(64, 158, 255, 1);
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        flex-shrink: 0;
-        float: right;
-        margin-top: 60px;
-        margin-bottom: 60px;
-        margin-right: 20px;
-        cursor: pointer;
-        .iconPub {
-          width: 15px;
-          height: 15px;
-          background-image: url(@/assets/images/taskpage/pub.png);
-          background-size: 100% 100%;
-          color: rgb(255, 255, 255);
-        }
-        .btnText {
-          font-size: 14px;
-          font-weight: 400;
-          color: rgb(255, 255, 255);
-          line-height: 36px;
-          margin-left: 5px;
-        }
-      }
-    }
-  }
-  .content3 {
-    margin-top: 20px;
-    .ant-tabs-tab-btn {
-      font-size: 18px;
-      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;
-          }
-        }
-      }
-    }
-    .second2 {
-      display: flex;
-      margin: 30px 0 0 32px;
-      .btn1 {
-        width: 130px;
-        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: 130px;
-        height: 40px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        margin-right: 16px;
-        border: 1px solid #409eff;
-        border-radius: 8px;
-        cursor: pointer;
-        background: #ffffff;
-        .btn2text {
-          color: #409eff;
-          margin-left: 5px;
-          font-size: 14px;
-        }
-      }
-    }
-    .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;
-      }
-    }
-    .tab {
-      .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;
-      }
+	//position: relative;
+	.addhead {
+		width: 100%;
+		height: 130px;
+		// background-color: lightgreen;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		position: relative;
 
-      .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;
-            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;
-            }
-          }
-        }
-      }
-    }
-  }
-  .content6 {
-    width: 100%;
-    height: 100%;
-    // background-color: #bfa;
-    .title {
-      font-size: 18px;
-      font-weight: 500;
-      color: #333333;
-      margin-left: 34px;
-    }
-    .line {
-      width: 100%;
-      height: 1px;
-      margin-top: 10px;
-      background: #e8e8e8;
-    }
-    .search {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      flex-wrap: wrap;
-      margin: 30px 34px 0 34px;
-      .left {
-        display: flex;
-        align-items: center;
-        flex-wrap: wrap;
-        margin-right: 10px;
-        .text {
-          font-size: 14px;
-          font-weight: 400;
-          color: rgba(0, 0, 0, 0.85);
-          white-space: nowrap;
-        }
-        .name {
-          display: flex;
-          align-items: center;
-          margin-bottom: 10px;
-          margin-right: 56px;
-        }
-        .time {
-          display: flex;
-          align-items: center;
-          // margin-left: 56px;
-          margin-bottom: 10px;
-        }
-      }
-      .right {
-        display: flex;
-        .btn {
-          display: flex;
-          width: 100px;
-          height: 40px;
+		.leftimg {
+			width: 151px;
+			height: 100px;
+			border: 10px solid #e7f2ff;
+			border-radius: 8px;
+			margin-left: 20px;
 
-          border-radius: 8px;
-          justify-content: center;
-          align-items: center;
-          margin-bottom: 10px;
-          .img1 {
-            width: 15px;
-            height: 17px;
-            background-image: url(../../assets/images/coursewareManage/search0.png);
-            background-size: 100%;
-            margin-right: 5px;
-          }
-          .img2 {
-            width: 16px;
-            height: 18px;
-            background-image: url(../../assets/images/coursewareManage/reset1.png);
-            background-size: 100%;
-            margin-right: 5px;
-          }
-        }
-        .btn1 {
-          background: #388be1;
-          color: #fff;
-          margin-right: 16px;
-        }
-        .btn2 {
-          border: 1px solid #388be1;
-          background: #ffffff;
-          color: #388be1;
-        }
-      }
-    }
-    .main {
-      margin-top: 10px;
-      display: flex;
-      flex-wrap: wrap;
-      margin-left: 34px;
-      margin-bottom: 20px;
-      .rank {
-        width: 422px;
-        height: 506px;
-        margin-right: 80px;
-        background: #ffffff;
-        border-radius: 2px;
-        border: 1px solid rgba(125, 125, 125, 0.39);
-        margin-bottom: 20px;
-        .rankhead {
-          height: 75px;
-          width: 100%;
-          border-bottom: 1px solid #e9e9e9;
-          // background-color: #bfa;
-          display: flex;
-          justify-content: center;
-          align-items: center;
-          .inhead {
-            width: 374px;
-            // background-color: lightblue;
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-            margin-top: 10px;
-            .left {
-              font-size: 16px;
-              font-weight: 500;
-              color: rgba(0, 0, 0, 0.85);
-            }
-            .right {
-              .ant-select {
-                .ant-select-selector {
-                  border-radius: 4px !important;
+			.img {
+				width: 100%;
+				height: 100%;
+			}
+		}
 
-                  border: 1px solid #388be1;
-                }
-              }
-            }
-          }
-        }
-        .tab {
-          // margin-top: 20px;
-          // margin-left: 24px;
-          border-radius: 4px 4px 0px 0px;
-          border: 1px solid #e9e9e9;
-          margin: 20px 24px 0 24px;
-          th.h {
-            background-color: #eff4fc !important;
-          }
+		.imgfor {
+			margin-left: 32px;
+			display: flex;
+			flex: 1;
+			flex-direction: column;
 
-          .ant-table-tbody
-            > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
-            > td {
-            background: #f6f9fd;
-          }
-        }
-      }
-    }
-  }
-  .content7 {
-    .set_tit {
-      margin-left: 34px;
-      font-size: 18px;
-      font-weight: 500;
-      color: #232425;
-    }
-    .line {
-      width: 100%;
-      height: 1px;
-      background-color: #e8e8e8;
-      margin-top: 10px;
-    }
-    .set_body {
-      margin-left: 34px;
-      margin-right: 34px;
-      position: relative;
-      .edit {
-        position: absolute;
-        width: 100px;
-        height: 40px;
-        background: #388be1;
-        border-radius: 8px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        right: 0;
-        cursor: pointer;
-        .img {
-          width: 18px;
-          height: 18px;
-          background-image: url(../../assets/images/basicinfo/edit.png);
-          background-size: 100%;
-          margin-right: 7px;
-        }
-        .ed {
-          font-size: 14px;
-          font-weight: 400;
-          color: #ffffff;
-        }
-      }
-      .set_content {
-        margin: 32px auto;
-        display: flex;
-        // justify-content: end;
-        .setc_name {
-          width: 150px;
-          display: flex;
-          justify-content: end;
-        }
-        .setc_main {
-          flex: 1;
-          margin-left: 12px;
-        }
-      }
-    }
-  }
+			.forz {
+				color: #363636;
+				font-weight: 600;
+				font-size: 16px;
+			}
+
+			.fort {
+				display: flex;
+				flex-wrap: wrap;
+				color: #878b92;
+				font-size: 14px;
+				margin-top: 2px;
+			}
+		}
+
+		@media screen and (max-width: 1030px) {
+			.imgfor {
+				margin-left: 20px;
+			}
+		}
+
+		.right {
+			// width: 500px;
+			height: 100%;
+			// background-color: red;
+			//position: absolute;
+			//right: 0;
+			display: flex;
+			align-items: center;
+
+			.img1 {
+				width: 24px;
+				height: 24px;
+				margin-right: 50px;
+			}
+
+			.line {
+				height: 65%;
+				width: 1px;
+				background-color: #e8effa;
+				margin-right: 28px;
+			}
+
+			.img2 {
+				width: 42px;
+				height: 42px;
+				margin-right: 22px;
+			}
+
+			.pub {
+				color: #ffb64e;
+				font-size: 14px;
+				margin-top: 5px;
+				margin-right: 30px;
+				cursor: pointer;
+			}
+
+			.return {
+				color: #4ea6ff;
+				font-size: 14px;
+				margin-top: 10px;
+				margin-right: 60px;
+			}
+
+			.more {
+				position: relative;
+				margin-right: 30px;
+				height: 30px;
+				display: flex;
+				align-items: center;
+
+				.moreArrow {
+					width: 13px;
+					height: 7px;
+					display: inline-block;
+					background-image: url("../../assets/images/navtop/down.png");
+					background-size: 100%;
+					margin: 2px;
+					margin-left: 15px;
+				}
+
+				.moreItems {
+					width: 110px;
+					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;
+			}
+		}
+	}
+
+	.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;
+		.ant-tabs-nav-wrap {
+			margin-left: 30px;
+		}
+
+		.onerow {
+			//width: 100%;
+			display: flex;
+			height: 40px;
+			position: relative;
+			margin-top: 15px;
+			margin-left: 38px;
+
+			//margin-right: 38px;
+			.taskmain {
+				font-size: 18px;
+				padding-top: 7px;
+				color: #000000;
+			}
+
+			.btn {
+				position: absolute;
+				top: 0;
+				right: 168px;
+				background-color: #409eff;
+				width: 130px;
+				height: 40px;
+				border-radius: 8px;
+				border: 1px solid #409eff;
+				color: #ffffff;
+				cursor: pointer;
+			}
+
+			.edit {
+				position: absolute;
+				right: 48px;
+				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");
+				}
+			}
+		}
+
+		.second {
+			display: flex;
+			justify-content: left;
+			flex-wrap: wrap;
+			margin-top: 40px;
+			margin-left: 20px;
+
+			.nubbox {
+				width: 253px;
+				height: 116px;
+				margin-top: 20px;
+				display: flex;
+				flex-direction: column;
+				justify-content: center;
+				align-items: center;
+				background: #fafbfc;
+				border-radius: 10px;
+				margin-left: 15px;
+
+				.nub1 {
+					color: #ffb54a;
+					font-size: 30px;
+					font-weight: 700;
+				}
+
+				.nub2 {
+					color: #6d7584;
+					font-size: 14px;
+				}
+			}
+
+			.taskbox {
+				width: 412px;
+				height: 160px;
+				border-radius: 10px;
+				position: relative;
+				margin-left: 68px;
+				margin-bottom: 40px;
+				cursor: pointer;
+
+				.leftt {
+					position: absolute;
+					top: 18px;
+					left: 0;
+				}
+
+				.photo {
+					position: absolute;
+					top: 42px;
+					left: 37px;
+				}
+
+				.rightt {
+					position: absolute;
+					top: 69px;
+					right: 26px;
+				}
+
+				.centerbox {
+					position: absolute;
+					top: 52px;
+					left: 145px;
+					font-size: 20px;
+					font-weight: 700;
+					//line-height: 36px;
+				}
+
+				.centermain {
+					color: rgba(135, 139, 146, 1);
+					font-size: 14px;
+					position: absolute;
+					left: 144px;
+					bottom: 49px;
+				}
+			}
+		}
+
+		.stagemess {
+			display: flex;
+			margin-left: 38px;
+
+			.stage1 {
+				width: 100px;
+				height: 33px;
+				text-align: center;
+				line-height: 34px;
+				border-radius: 6px;
+				color: #ffffff;
+				font-size: 16px;
+				background: #4ea6ff;
+				margin-right: 10px;
+				margin-top: 19px;
+				cursor: pointer;
+			}
+
+			.stage2 {
+				width: 100px;
+				height: 33px;
+				text-align: center;
+				line-height: 34px;
+				border-radius: 6px;
+				border: 1px solid #ebeef3;
+				color: #000000;
+				font-size: 16px;
+				background: #ffffff;
+				margin-right: 10px;
+				margin-top: 19px;
+				cursor: pointer;
+			}
+		}
+
+		.stagesecond {
+			display: flex;
+			margin-left: 39px;
+			margin-top: 29px;
+
+			.staname {
+				color: #999ba3;
+				font-size: 14px;
+			}
+
+			.stamess {
+				color: #4f5156;
+				font-size: 14px;
+			}
+		}
+
+		.stagelast {
+			display: flex;
+			flex-wrap: wrap;
+			justify-content: center;
+			margin-bottom: 55px;
+
+			.stagepro {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				margin-top: 55px;
+				margin-right: 120px;
+
+				.ant-progress-circle-path {
+					stroke: #4ea6ff;
+				}
+
+				.ant-progress-text {
+					color: #4ea6ff;
+					font-weight: 700;
+				}
+
+				.protext {
+					color: #6d7584;
+					font-size: 14px;
+					margin-top: 25px;
+				}
+			}
+
+			.proright {
+				width: 500px;
+				margin-top: 55px;
+				margin-left: 50px;
+
+				.ant-progress-bg {
+					height: 24px !important;
+					background: #4ea6ff;
+				}
+
+				.ant-progress-inner {
+					height: 24px;
+				}
+
+				.pronub {
+					color: #4ea6ff;
+					font-size: 14px;
+					margin: 5px 0;
+				}
+
+				.proright1 {
+					display: flex;
+					justify-content: right;
+
+					.textpro {
+						color: #6d7584;
+						font-size: 14px;
+						margin-right: 20px;
+					}
+
+					.ant-progress-text {
+						color: #4ea6ff;
+						font-size: 14px;
+						font-weight: 700;
+					}
+				}
+			}
+		}
+
+		.stage {
+			display: flex;
+			height: 49px;
+			background-color: #eff4fc;
+			align-items: center;
+			margin-top: 20px;
+			margin-left: 38px;
+			margin-right: 38px;
+
+			.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-left: 38px;
+			margin-right: 38px;
+			//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;
+
+				.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-left: 10px;
+				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;
+				}
+			}
+		}
+
+		.noticeTitle {
+			margin-left: 38px;
+			margin-right: 38px;
+			padding-top: 20px;
+
+			.publish {
+				width: 100px;
+				// padding: 0px 26px 0px 26px;
+				height: 38px;
+				background: rgb(64, 158, 255);
+				border-radius: 8px;
+				border: 1px solid rgba(64, 158, 255, 1);
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				flex-shrink: 0;
+				float: right;
+				margin-top: 60px;
+				margin-bottom: 60px;
+				margin-right: 20px;
+				cursor: pointer;
+
+				.iconPub {
+					width: 15px;
+					height: 15px;
+					background-image: url(@/assets/images/taskpage/pub.png);
+					background-size: 100% 100%;
+					color: rgb(255, 255, 255);
+				}
+
+				.btnText {
+					font-size: 14px;
+					font-weight: 400;
+					color: rgb(255, 255, 255);
+					line-height: 36px;
+					margin-left: 5px;
+				}
+			}
+		}
+	}
+
+	.content3 {
+		margin-top: 20px;
+
+		.ant-tabs-tab-btn {
+			font-size: 18px;
+			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;
+					}
+				}
+			}
+		}
+
+		.second2 {
+			display: flex;
+			margin: 30px 0 0 32px;
+
+			.btn1 {
+				width: 130px;
+				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: 130px;
+				height: 40px;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				margin-right: 16px;
+				border: 1px solid #409eff;
+				border-radius: 8px;
+				cursor: pointer;
+				background: #ffffff;
+
+				.btn2text {
+					color: #409eff;
+					margin-left: 5px;
+					font-size: 14px;
+				}
+			}
+		}
+
+		.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;
+			}
+		}
+
+		.tab {
+			.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;
+						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;
+						}
+					}
+				}
+			}
+		}
+	}
+
+	.content6 {
+		width: 100%;
+		height: 100%;
+
+		// background-color: #bfa;
+		.title {
+			font-size: 18px;
+			font-weight: 500;
+			color: #333333;
+			margin-left: 34px;
+		}
+
+		.line {
+			width: 100%;
+			height: 1px;
+			margin-top: 10px;
+			background: #e8e8e8;
+		}
+
+		.search {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			flex-wrap: wrap;
+			margin: 30px 34px 0 34px;
+
+			.left {
+				display: flex;
+				align-items: center;
+				flex-wrap: wrap;
+				margin-right: 10px;
+
+				.text {
+					font-size: 14px;
+					font-weight: 400;
+					color: rgba(0, 0, 0, 0.85);
+					white-space: nowrap;
+				}
+
+				.name {
+					display: flex;
+					align-items: center;
+					margin-bottom: 10px;
+					margin-right: 56px;
+				}
+
+				.time {
+					display: flex;
+					align-items: center;
+					// margin-left: 56px;
+					margin-bottom: 10px;
+				}
+			}
+
+			.right {
+				display: flex;
+
+				.btn {
+					display: flex;
+					width: 100px;
+					height: 40px;
+
+					border-radius: 8px;
+					justify-content: center;
+					align-items: center;
+					margin-bottom: 10px;
+
+					.img1 {
+						width: 15px;
+						height: 17px;
+						background-image: url(../../assets/images/coursewareManage/search0.png);
+						background-size: 100%;
+						margin-right: 5px;
+					}
+
+					.img2 {
+						width: 16px;
+						height: 18px;
+						background-image: url(../../assets/images/coursewareManage/reset1.png);
+						background-size: 100%;
+						margin-right: 5px;
+					}
+				}
+
+				.btn1 {
+					background: #388be1;
+					color: #fff;
+					margin-right: 16px;
+				}
+
+				.btn2 {
+					border: 1px solid #388be1;
+					background: #ffffff;
+					color: #388be1;
+				}
+			}
+		}
+
+		.main {
+			margin-top: 10px;
+			display: flex;
+			flex-wrap: wrap;
+			margin-left: 34px;
+			margin-bottom: 20px;
+
+			.rank {
+				width: 422px;
+				height: 506px;
+				margin-right: 80px;
+				background: #ffffff;
+				border-radius: 2px;
+				border: 1px solid rgba(125, 125, 125, 0.39);
+				margin-bottom: 20px;
+
+				.rankhead {
+					height: 75px;
+					width: 100%;
+					border-bottom: 1px solid #e9e9e9;
+					// background-color: #bfa;
+					display: flex;
+					justify-content: center;
+					align-items: center;
+
+					.inhead {
+						width: 374px;
+						// background-color: lightblue;
+						display: flex;
+						justify-content: space-between;
+						align-items: center;
+						margin-top: 10px;
+
+						.left {
+							font-size: 16px;
+							font-weight: 500;
+							color: rgba(0, 0, 0, 0.85);
+						}
+
+						.right {
+							.ant-select {
+								.ant-select-selector {
+									border-radius: 4px !important;
+
+									border: 1px solid #388be1;
+								}
+							}
+						}
+					}
+				}
+
+				.tab {
+					// margin-top: 20px;
+					// margin-left: 24px;
+					border-radius: 4px 4px 0px 0px;
+					border: 1px solid #e9e9e9;
+					margin: 20px 24px 0 24px;
+
+					th.h {
+						background-color: #eff4fc !important;
+					}
+
+					.ant-table-tbody>tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)>td {
+						background: #f6f9fd;
+					}
+				}
+			}
+		}
+	}
+
+	.content7 {
+		.set_tit {
+			margin-left: 34px;
+			font-size: 18px;
+			font-weight: 500;
+			color: #232425;
+		}
+
+		.line {
+			width: 100%;
+			height: 1px;
+			background-color: #e8e8e8;
+			margin-top: 10px;
+		}
+
+		.set_body {
+			margin-left: 34px;
+			margin-right: 34px;
+			position: relative;
+
+			.edit {
+				position: absolute;
+				width: 100px;
+				height: 40px;
+				background: #388be1;
+				border-radius: 8px;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				right: 0;
+				cursor: pointer;
+
+				.img {
+					width: 18px;
+					height: 18px;
+					background-image: url(../../assets/images/basicinfo/edit.png);
+					background-size: 100%;
+					margin-right: 7px;
+				}
+
+				.ed {
+					font-size: 14px;
+					font-weight: 400;
+					color: #ffffff;
+				}
+			}
+
+			.set_content {
+				margin: 32px auto;
+				display: flex;
+
+				// justify-content: end;
+				.setc_name {
+					width: 150px;
+					display: flex;
+					justify-content: end;
+				}
+
+				.setc_main {
+					flex: 1;
+					margin-left: 12px;
+				}
+			}
+		}
+	}
 }
 </style>