From f387d3691b8fcdd45a580e7d65b9d96c1461e550 Mon Sep 17 00:00:00 2001
From: wuyx <wuyx@dongwu-inc.com>
Date: Fri, 23 Dec 2022 08:58:50 +0800
Subject: [PATCH 1/3] fix

---
 src/views/project/ProjectManage.vue | 521 ++++++++++++++--------------
 1 file changed, 254 insertions(+), 267 deletions(-)

diff --git a/src/views/project/ProjectManage.vue b/src/views/project/ProjectManage.vue
index 92d5690..29c8cdc 100644
--- a/src/views/project/ProjectManage.vue
+++ b/src/views/project/ProjectManage.vue
@@ -7,11 +7,11 @@
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
 <template>
-  <div class="projectManage">
-    <div class="content">
-      <div class="title">我的项目</div>
-      <div class="search">
-        <!-- <el-select v-model="value" class="m-2" placeholder="Select">
+	<div class="projectManage">
+		<div class="content">
+			<div class="title">我的项目</div>
+			<div class="search">
+				<!-- <el-select v-model="value" class="m-2" placeholder="Select">
           <el-option
             v-for="item in projectClassify"
             :key="item.value"
@@ -27,88 +27,61 @@
             :value="item.value"
           />
         </el-select> -->
-        <div style="width: 200px; margin-right: 20px">
-          <el-input v-model="projectname" placeholder="请输入项目名称" />
-        </div>
-        <div style="width: 420px">
-          <el-date-picker
-            v-model="searchTime"
-            type="datetimerange"
-            start-placeholder="开始时间"
-            end-placeholder="结束时间"
-            @change="selectTime"
-          />
-        </div>
+				<div style="width: 200px; margin-right: 20px">
+					<el-input v-model="projectname" placeholder="请输入项目名称" />
+				</div>
+				<div style="width: 420px">
+					<el-date-picker v-model="searchTime" type="datetimerange" start-placeholder="开始时间" end-placeholder="结束时间"
+						@change="selectTime" />
+				</div>
 
-        <button
-          class="searchBtn"
-          @click="searchClick"
-          style="margin-left: 20px"
-        >
-          搜索
-        </button>
-        <button class="searchBtn" @click="resetClick">重置</button>
-      </div>
-      <div class="projectList" v-if="projectList.length==0" style="display:flex;color:#909399;">
-        <img
-            class="img2"
-            style="margin-left: 675px;margin-top: 165px;width:148px;height:220px;"
-            src="../../assets/image/notask.png"
-          />
-      </div>
-      <div v-else class="projectList" v-for="(i, k) in projectList" :key="k">
-        <div style="display: flex">
-          <img
-            style="width: 253px; height: 144px; border-radius: 4px"
-            :src="i.picUrl"
-          />
-          <div style="margin-left: 29px">
-            <div class="projectName" :title="i.name">
-              {{ i.name }}
-            </div>
-            <div class="progress">
-              <div class="progressNow">当前进度：</div>
-              <div style="width: 115px">
-                <el-progress
-                  :percentage="parseInt(i.finishTaskNum / i.totalTaskNum) * 100"
-                  :show-text="false"
-                  :stroke-width="8"
-                  color="rgba(255, 160, 80, 1)"
-                />
-              </div>
-              <div class="progressNum">
-                {{
-                  i.finishTaskNum && i.totalTaskNum
-                    ? parseInt(i.finishTaskNum / i.totalTaskNum) * 100
-                    : 0
-                }}%
-              </div>
-            </div>
-            <div class="studyNew">最新一次学习时间：{{ i.lastStudyTime }}</div>
-          </div>
-        </div>
-        <div
-          class="tobestarted"
-          v-if="i.status == 2"
-          @click="goProjectDetails(i)"
-        >
-          待开始
-        </div>
-        <div class="gostudy" v-if="i.status == 0" @click="goProjectDetails(i)">
-          去学习
-        </div>
-        <div class="finish" v-if="i.status == 1" @click="goProjectDetails(i)">
-          已完成
-        </div>
-        <div
-          class="tobestarted"
-          v-if="i.status == 3"
-          @click="goProjectDetails(i)"
-        >
-          已结束
-        </div>
-      </div>
-      <!-- <div
+				<button class="searchBtn" @click="searchClick" style="margin-left: 20px">
+					搜索
+				</button>
+				<button class="searchBtn" @click="resetClick">重置</button>
+			</div>
+			<div class="projectList" v-if="projectList.length == 0" style="display:flex;color:#909399;">
+				<img class="img2" style="margin-left: 675px;margin-top: 165px;width:148px;height:220px;"
+					src="../../assets/image/notask.png" />
+			</div>
+			<div v-else class="projectList" v-for="(i, k) in projectList" :key="k">
+				<div style="display: flex">
+					<img style="width: 253px; height: 144px; border-radius: 4px" :src="i.picUrl" />
+					<div style="margin-left: 29px">
+						<div class="projectName" :title="i.name">
+							{{ i.name }}
+						</div>
+						<div class="progress">
+							<div class="progressNow">当前进度：</div>
+							<div style="width: 115px">
+								<el-progress :percentage="parseInt(i.finishTaskNum / i.totalTaskNum) * 100" :show-text="false"
+									:stroke-width="8" color="rgba(255, 160, 80, 1)" />
+							</div>
+							<div class="progressNum">
+								{{
+										i.finishTaskNum && i.totalTaskNum
+											? parseInt(i.finishTaskNum / i.totalTaskNum) * 100
+											: 0
+								}}%
+							</div>
+						</div>
+						<div class="studyNew">最新一次学习时间：{{ i.lastStudyTime }}</div>
+					</div>
+				</div>
+				<div class="tobestarted" v-if="i.status == 2" @click="goProjectDetails(i)">
+					待开始
+				</div>
+				<div class="gostudy" v-if="i.status == 0" @click="goProjectDetails(i)">
+					去学习
+				</div>
+				<div class="finish" v-if="i.status == 1" @click="goProjectDetails(i)">
+					已完成
+				</div>
+				<div class="tobestarted" v-if="i.status == 3" @click="goProjectDetails(i)">
+					已结束
+				</div>
+			</div>
+			<!-- <div
         style="display: flex; justify-content: center; margin-top: 30px"
         v-if="projectTotal > 10"
       >
@@ -123,17 +96,17 @@
           />
         </div>
       </div> -->
-    </div>
-  </div>
+		</div>
+	</div>
 </template>
 <script setup>
 import { reactive, toRefs, ref, onMounted, computed } from "vue";
 
 import { boeRequest, request, usePage, useRequest } from "@/api/request";
 import {
-  ROUTER_CHAPTER_LIST,
-  PROJECT_LIST,
-  ROUTER_UNCOMPLETE_LIST,
+	ROUTER_CHAPTER_LIST,
+	PROJECT_LIST,
+	ROUTER_UNCOMPLETE_LIST,
 } from "@/api/api";
 
 import { useRouter } from "vue-router";
@@ -154,24 +127,24 @@ const userInfo = computed(() => store.state.userInfo);
 
 //获取项目列表--------start------------------------------------
 const getProject = () => {
-  request(PROJECT_LIST, {
-    beginTime: beginTime.value,
-    endTime: endTime.value,
-    key: projectname.value,
-    pageNo: currentPage.value,
-    pageSize: pageSize.value,
-  })
-    .then((res) => {
-      console.log("获取成功", res);
-      if (res.code === 200) {
-        projectList.value = res.data.rows;
-        projectTotal.value = Number(res.data.total);
-        console.log("projectTotal.value", projectTotal.value);
-      }
-    })
-    .catch((err) => {
-      console.log("获取失败", err);
-    });
+	request(PROJECT_LIST, {
+		beginTime: beginTime.value,
+		endTime: endTime.value,
+		key: projectname.value,
+		pageNo: currentPage.value,
+		pageSize: pageSize.value,
+	})
+		.then((res) => {
+			console.log("获取成功", res);
+			if (res.code === 200) {
+				projectList.value = res.data.rows;
+				projectTotal.value = Number(res.data.total);
+				console.log("projectTotal.value", projectTotal.value);
+			}
+		})
+		.catch((err) => {
+			console.log("获取失败", err);
+		});
 };
 getProject();
 
@@ -180,175 +153,189 @@ getProject();
 
 //搜索
 const searchClick = () => {
-  console.log("点击搜索", projectname.value, searchTime.value);
+	console.log("点击搜索", projectname.value, searchTime.value);
 
-  if (searchTime.value) {
-    beginTime.value = toDate(
-      new Date(searchTime.value[0]).getTime() / 1000,
-      "Y-M-D h:m:s"
-    );
-    endTime.value = toDate(
-      new Date(searchTime.value[1]).getTime() / 1000,
-      "Y-M-D h:m:s"
-    );
-  }
-  console.log("beginTime", beginTime.value, endTime.value);
-  getProject();
+	if (searchTime.value) {
+		beginTime.value = toDate(
+			new Date(searchTime.value[0]).getTime() / 1000,
+			"Y-M-D h:m:s"
+		);
+		endTime.value = toDate(
+			new Date(searchTime.value[1]).getTime() / 1000,
+			"Y-M-D h:m:s"
+		);
+	}
+	console.log("beginTime", beginTime.value, endTime.value);
+	getProject();
 };
 //重置
 const resetClick = () => {
-  searchTime.value = "";
-  projectname.value = "";
-  currentPage.value = 1;
-  beginTime.value = "";
-  endTime.value = "";
-  getProject();
-  console.log("点击重置");
+	searchTime.value = "";
+	projectname.value = "";
+	currentPage.value = 1;
+	beginTime.value = "";
+	endTime.value = "";
+	getProject();
+	console.log("点击重置");
 };
 //搜索--------------end-----------------------------------------
 const router = useRouter();
 const goProjectDetails = (value) => {
-  import.meta.env.MODE === "development"
-      ? router.push({
-        path: "/projectdetails",
-        query: { projectId: value.projectId },
-      })
-      : window.open(
-          `${import.meta.env.VITE_BOE_PATH_DETAIL_URL}/projectdetails&params=${encodeURIComponent(
-              `projectId=${routerId}`
-          )}`
-      );
+	import.meta.env.MODE === "development"
+		? router.push({
+			path: "/projectdetails",
+			query: { projectId: value.projectId },
+		})
+		: window.open(
+			`${import.meta.env.VITE_BOE_PATH_DETAIL_URL}/projectdetails&params=${encodeURIComponent(
+				`projectId=${value.projectId}`
+			)}`
+		);
 };
 </script>
 <style lang="scss">
 .projectManage {
-  width: 100%;
-  min-height: 800px;
-  //border-radius: 8px;
-  background-color: rgba(255, 255, 255, 1);
-  display: flex;
-  // background-color: #ccc;
-  .content {
-    width: 100%;
-    // flex: 1;
-    margin-top: 50px;
-    margin-left: 81px;
-    .title {
-      font-size: 18px;
-      font-weight: 600;
-      color: #333333;
-      line-height: 25px;
-    }
-    .search {
-      margin-top: 31px;
-      display: flex;
-      align-items: center;
-      .searchBtn {
-        width: 100px;
-        height: 35px;
-        border-radius: 8px;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        background: #387df7;
-        border: 1px solid #387df7;
-        color: #ffffff;
-        cursor: pointer;
-        margin-left: 10px;
-      }
-    }
-    .projectList {
-      margin-top: 40px;
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      overflow-x: auto;
-      .projectName {
-        width: 270px;
-        margin-top: 12px;
-        font-size: 18px;
-        font-weight: 600;
-        color: #333333;
-        line-height: 25px;
-        margin-bottom: 40px;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-      }
-      .progress {
-        display: flex;
-        align-items: center;
-        .el-progress-bar__outer {
-          background-color: rgba(255, 160, 80, 0.19);
-        }
-        .progressNow {
-          font-size: 14px;
-          font-weight: 400;
-          color: #333333;
-          line-height: 20px;
-          margin-right: 20px;
-        }
-        .progressNum {
-          font-size: 12px;
-          font-weight: 400;
-          color: #999999;
-          line-height: 17px;
-          margin-left: 26px;
-        }
-      }
-      .studyNew {
-        margin-top: 16px;
-        font-size: 14px;
-        font-weight: 400;
-        color: #999999;
-        line-height: 20px;
-      }
-      .tobestarted {
-        width: 140px;
-        height: 40px;
-        border-radius: 4px;
-        border: 1px solid #387df7;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        font-size: 16px;
-        font-weight: 400;
-        color: #387df7;
-        line-height: 22px;
-        cursor: pointer;
-        margin-right: 120px;
-      }
-      .gostudy {
-        width: 140px;
-        height: 40px;
-        background: #387df7;
-        box-shadow: 1px 2px 15px 1px rgba(56, 125, 247, 0.34);
-        border-radius: 4px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        font-size: 16px;
-        font-weight: 400;
-        color: #ffffff;
-        line-height: 22px;
-        margin-right: 120px;
-        cursor: pointer;
-      }
-      .finish {
-        width: 140px;
-        height: 40px;
-        background: rgba(56, 125, 247, 0.6);
-        border-radius: 4px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        font-size: 16px;
-        font-weight: 400;
-        color: #ffffff;
-        line-height: 22px;
-        cursor: pointer;
-      }
-    }
-  }
+	width: 100%;
+	min-height: 800px;
+	//border-radius: 8px;
+	background-color: rgba(255, 255, 255, 1);
+	display: flex;
+
+	// background-color: #ccc;
+	.content {
+		width: 100%;
+		// flex: 1;
+		margin-top: 50px;
+		margin-left: 81px;
+
+		.title {
+			font-size: 18px;
+			font-weight: 600;
+			color: #333333;
+			line-height: 25px;
+		}
+
+		.search {
+			margin-top: 31px;
+			display: flex;
+			align-items: center;
+
+			.searchBtn {
+				width: 100px;
+				height: 35px;
+				border-radius: 8px;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				background: #387df7;
+				border: 1px solid #387df7;
+				color: #ffffff;
+				cursor: pointer;
+				margin-left: 10px;
+			}
+		}
+
+		.projectList {
+			margin-top: 40px;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			overflow-x: auto;
+
+			.projectName {
+				width: 270px;
+				margin-top: 12px;
+				font-size: 18px;
+				font-weight: 600;
+				color: #333333;
+				line-height: 25px;
+				margin-bottom: 40px;
+				overflow: hidden;
+				text-overflow: ellipsis;
+				white-space: nowrap;
+			}
+
+			.progress {
+				display: flex;
+				align-items: center;
+
+				.el-progress-bar__outer {
+					background-color: rgba(255, 160, 80, 0.19);
+				}
+
+				.progressNow {
+					font-size: 14px;
+					font-weight: 400;
+					color: #333333;
+					line-height: 20px;
+					margin-right: 20px;
+				}
+
+				.progressNum {
+					font-size: 12px;
+					font-weight: 400;
+					color: #999999;
+					line-height: 17px;
+					margin-left: 26px;
+				}
+			}
+
+			.studyNew {
+				margin-top: 16px;
+				font-size: 14px;
+				font-weight: 400;
+				color: #999999;
+				line-height: 20px;
+			}
+
+			.tobestarted {
+				width: 140px;
+				height: 40px;
+				border-radius: 4px;
+				border: 1px solid #387df7;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 16px;
+				font-weight: 400;
+				color: #387df7;
+				line-height: 22px;
+				cursor: pointer;
+				margin-right: 120px;
+			}
+
+			.gostudy {
+				width: 140px;
+				height: 40px;
+				background: #387df7;
+				box-shadow: 1px 2px 15px 1px rgba(56, 125, 247, 0.34);
+				border-radius: 4px;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 16px;
+				font-weight: 400;
+				color: #ffffff;
+				line-height: 22px;
+				margin-right: 120px;
+				cursor: pointer;
+			}
+
+			.finish {
+				width: 140px;
+				height: 40px;
+				background: rgba(56, 125, 247, 0.6);
+				border-radius: 4px;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 16px;
+				font-weight: 400;
+				color: #ffffff;
+				line-height: 22px;
+				cursor: pointer;
+			}
+		}
+	}
 }
 </style>

From 70c441e3436540420aca6fa06fa8cd9752cf98e8 Mon Sep 17 00:00:00 2001
From: wuyx <wuyx@dongwu-inc.com>
Date: Fri, 23 Dec 2022 15:54:28 +0800
Subject: [PATCH 2/3] =?UTF-8?q?feat:=E5=A2=9E=E5=8A=A0=E9=A1=B9=E7=9B=AE/?=
 =?UTF-8?q?=E5=AD=A6=E4=B9=A0=E8=B7=AF=E5=BE=84=E5=9B=BE=E7=9A=84=E7=AE=80?=
 =?UTF-8?q?=E4=BB=8B=E5=92=8C=E5=85=B3=E5=8D=A1=E8=AF=B4=E6=98=8E?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/project/ProjectDetails.vue |   46 +-
 src/views/roadmap/PathDetails.vue    | 1247 ++++++++++++--------------
 2 files changed, 618 insertions(+), 675 deletions(-)

diff --git a/src/views/project/ProjectDetails.vue b/src/views/project/ProjectDetails.vue
index 8648bcd..8f77189 100644
--- a/src/views/project/ProjectDetails.vue
+++ b/src/views/project/ProjectDetails.vue
@@ -2,7 +2,7 @@
 	<div class="pathdetails" style="padding: 30px">
 		<!-- 面包屑导航 -->
 		<div class="crumb">
-			<div>{{data.name}}</div>
+			<div>{{ data.name }}</div>
 			<div style="margin-left: 6px; margin-right: 6px">/</div>
 			<div style="font-weight: 700">项目详情</div>
 
@@ -15,12 +15,12 @@
 		</div>
 		<!-- 面包屑导航 -->
 		<div class="pdname">
-			{{ userInfo.bandDesc }} 
-			<span @click="introductionPro"  style="font-size:14px;color:#fff;margin-left: 33px;cursor: pointer;">简介
+			{{ userInfo.bandDesc }}
+			<span @click="introductionPro" style="font-size:14px;color:#fff;margin-left: 33px;cursor: pointer;">简介
 				<span style="position: relative;top:1px;left:-3px;cursor: pointer;">></span>
 			</span>
 		</div>
-		
+
 		<!-- 详细信息 -->
 		<div class="detailinfo">
 			<div class="detailL">
@@ -116,7 +116,7 @@
 					<el-tabs v-model="activeName" @tab-click="handleClick">
 						<el-tab-pane label="课程公告" name="first">
 							<div class="notice">
-								{{ data.remark || "暂无公告" }}
+								{{ data.notice || "暂无公告" }}
 							</div>
 						</el-tab-pane>
 						<!--  
@@ -238,17 +238,13 @@
 		</div>
 		<!-- 详细信息 -->
 		<!-- 弹框提示信息 -->
-		<el-dialog
-			title=""
-			top="347px"
-			v-model="dialogVisible"
-			:show-close="false"
+		<el-dialog title="" top="347px" v-model="dialogVisible" :show-close="false"
 			style="display:flex;justify-content:center;align-items:center;height: 283px;padding:0;border-radius: 4px;"
 			width="502px">
 			<div style="width:288px;color:#333333;font-size: 22px;font-weight: 600;">{{ dialogVisibleTip }}</div>
 			<span slot="footer" style="display:inline-block;margin-top:60px;">
 				<el-button @click="dialogVisible = false" style="width:140px;height:40px;margin-right: 22px;">取消</el-button>
-				<el-button type="primary" @click="dialogVisible = false"  style="width:140px;height:40px;">确定</el-button>
+				<el-button type="primary" @click="dialogVisible = false" style="width:140px;height:40px;">确定</el-button>
 			</span>
 		</el-dialog>
 	</div>
@@ -375,7 +371,7 @@ const dialogVisibleTip = ref('该任务无法学习，请联系管理员进行
 // }
 
 function introductionPro() {
-	dialogVisibleTip.value =data.value.remark;
+	dialogVisibleTip.value = data.value.remark;
 	dialogVisible.value = true;
 }
 
@@ -386,7 +382,7 @@ function toFinish(d, sName, chapterId) {
 		let date1 = new Date(d.endTime).getTime();
 		let date2 = new Date().getTime();
 		if (date1 < date2) {
-			dialogVisibleTip.value ='当前作业已结束';
+			dialogVisibleTip.value = '当前作业已结束';
 			dialogVisible.value = true;
 			// ElMessage.error("当前作业已结束")
 			return
@@ -397,7 +393,7 @@ function toFinish(d, sName, chapterId) {
 		let date1 = new Date(d.endTime).getTime();
 		let date2 = new Date().getTime();
 		if (date1 < date2) {
-			dialogVisibleTip.value ='当前直播已结束';
+			dialogVisibleTip.value = '当前直播已结束';
 			dialogVisible.value = true;
 			return
 		}
@@ -406,7 +402,7 @@ function toFinish(d, sName, chapterId) {
 	if (d.type == 5) {
 		if (d.taskStatus == 1 || d.taskStatus == 2) {
 			// ElMessage.error("该任务无法学习，请联系管理员进行替换。")
-			dialogVisibleTip.value ='该任务无法学习，请联系管理员进行替换！';
+			dialogVisibleTip.value = '该任务无法学习，请联系管理员进行替换！';
 			dialogVisible.value = true;
 			return
 		}
@@ -415,7 +411,7 @@ function toFinish(d, sName, chapterId) {
 	if (d.type == 11) {
 		if (d.taskStatus == 1 || d.taskStatus == 2) {
 			// ElMessage.error("该任务无法学习，请联系管理员进行替换。")
-			dialogVisibleTip.value ='该任务无法学习，请联系管理员进行替换！';
+			dialogVisibleTip.value = '该任务无法学习，请联系管理员进行替换！';
 			dialogVisible.value = true;
 			return
 		}
@@ -425,7 +421,7 @@ function toFinish(d, sName, chapterId) {
 		let date1 = new Date(d.endTime).getTime();
 		let date2 = new Date().getTime();
 		if (date1 < date2) {
-			dialogVisibleTip.value ='当前活动已结束';
+			dialogVisibleTip.value = '当前活动已结束';
 			dialogVisible.value = true;
 			return
 		}
@@ -434,7 +430,7 @@ function toFinish(d, sName, chapterId) {
 	if (d.type == 1) {
 		if (d.taskStatus == 1 || d.taskStatus == 2) {
 			// ElMessage.error("该任务无法学习，请联系管理员进行替换。")
-			dialogVisibleTip.value ='该任务无法学习，请联系管理员进行替换！';
+			dialogVisibleTip.value = '该任务无法学习，请联系管理员进行替换！';
 			dialogVisible.value = true;
 			return
 		}
@@ -443,7 +439,7 @@ function toFinish(d, sName, chapterId) {
 	if (d.type == 2) {
 		if (d.taskStatus == 1 || d.taskStatus == 2) {
 			// ElMessage.error("该任务无法学习，请联系管理员进行替换。")
-			dialogVisibleTip.value ='该任务无法学习，请联系管理员进行替换！';
+			dialogVisibleTip.value = '该任务无法学习，请联系管理员进行替换！';
 			dialogVisible.value = true;
 			return
 		}
@@ -492,21 +488,23 @@ function whiteTypes(type) {
 	.el-dialog__header {
 		display: none;
 	}
+
 	.crumb {
 		color: #fff;
 		display: flex;
 		font-size: 14px;
 		line-height: 24px;
+
 		.return {
 			position: absolute;
 			right: 10%;
 
 			.text {
-					text-align: center;
-					display: flex;
-					flex-direction: row;
-					align-items: center;
-				}
+				text-align: center;
+				display: flex;
+				flex-direction: row;
+				align-items: center;
+			}
 		}
 	}
 
diff --git a/src/views/roadmap/PathDetails.vue b/src/views/roadmap/PathDetails.vue
index 2d3a7bd..974b8d6 100644
--- a/src/views/roadmap/PathDetails.vue
+++ b/src/views/roadmap/PathDetails.vue
@@ -1,760 +1,705 @@
 <template>
-  <div class="pathdetails" style="padding: 30px">
-    <!-- 面包屑导航 -->
-    <div class="crumb">
-      <div>{{ routerName }}</div>
-      <div style="margin-left: 6px; margin-right: 6px">/</div>
-      <div style="font-weight: 700">路径图详情</div>
+	<div class="pathdetails" style="padding: 30px">
+		<!-- 面包屑导航 -->
+		<div class="crumb">
+			<div>{{ routerName }}</div>
+			<div style="margin-left: 6px; margin-right: 6px">/</div>
+			<div style="font-weight: 700">路径图详情</div>
 
-      <div class="return">
+			<div class="return">
 				<div style="display: flex" @click="returnclick">
 					<img class="img2" style="margin-right: 22px;cursor: pointer;" src="../../assets/image/return.png" />
 					<div style="cursor: pointer;" class="text">返回</div>
 				</div>
 			</div>
-    </div>
-    <!-- 面包屑导航 -->
-    <div class="pdname">
-      {{ userInfo.bandDesc }}
-      <span @click="introductionPro"  style="font-size:14px;color:#fff;margin-left: 33px;cursor: pointer;">简介
+		</div>
+		<!-- 面包屑导航 -->
+		<div class="pdname">
+			{{ userInfo.bandDesc }}
+			<span @click="introductionPro" style="font-size:14px;color:#fff;margin-left: 33px;cursor: pointer;">关卡说明
 				<span style="position: relative;top:1px;left:-3px;cursor: pointer;">></span>
 			</span>
-    </div>
-    <!-- 详细信息 -->
-    <div class="detailinfo">
-      <div class="detailL">
-        <div>
-          <div class="title">
-            <div class="titleL">{{ data.currentStageName }}</div>
-            <div class="titleR" :style="{ display: 'flex' }">
-              <img
-                  :src="data.currentChapterCnt?circle:circle2"/>
-              <div class="titleRT" :style="{color:data.currentChapterCnt?'':'rgba(102, 102, 102, 1)'}">
-                {{ data.currentChapterCnt ? '进行中' : '未开始' }}
-              </div>
-            </div>
-          </div>
-          <div
-              class="course"
-              v-for="(value, index) in data.taskBoList?.filter(
-              (e) => !whiteTypes(e.type)
-            )"
-              :key="index"
-          >
-            <div style="width: 70%">
-              <div class="coursename" :title="value.name">{{ value.name }}</div>
-              <div class="coursetag">
-                <div
-                    class="tag1"
-                    style="margin-right: 11px; margin-top: 16px"
-                    v-if="value.flag"
-                >
-                  必修
-                </div>
-                <div
-                    class="tag2"
-                    style="margin-right: 11px; margin-top: 16px"
-                    v-if="!value.flag"
-                >
-                  选修
-                </div>
-                <div class="tag3" style="margin-right: 11px; margin-top: 16px">
-                  {{ types.typeName[value.type] || "" }}
-                </div>
+		</div>
+		<!-- 详细信息 -->
+		<div class="detailinfo">
+			<div class="detailL">
+				<div>
+					<div class="title">
+						<div class="titleL">{{ data.currentStageName }}</div>
+						<div class="titleR" :style="{ display: 'flex' }">
+							<img :src="data.currentChapterCnt ? circle : circle2" />
+							<div class="titleRT" :style="{ color: data.currentChapterCnt ? '' : 'rgba(102, 102, 102, 1)' }">
+								{{ data.currentChapterCnt ? '进行中' : '未开始' }}
+							</div>
+						</div>
+					</div>
+					<div class="course" v-for="(value, index) in data.taskBoList?.filter(
+						(e) => !whiteTypes(e.type)
+					)" :key="index">
+						<div style="width: 70%">
+							<div class="coursename" :title="value.name">{{ value.name }}</div>
+							<div class="coursetag">
+								<div class="tag1" style="margin-right: 11px; margin-top: 16px" v-if="value.flag">
+									必修
+								</div>
+								<div class="tag2" style="margin-right: 11px; margin-top: 16px" v-if="!value.flag">
+									选修
+								</div>
+								<div class="tag3" style="margin-right: 11px; margin-top: 16px">
+									{{ types.typeName[value.type] || "" }}
+								</div>
 
-                <!--                                <div-->
-                <!--                                    v-for="(item, key) in value.flag"-->
-                <!--                                    :key="key"-->
-                <!--                                    :class="{1:'tag1',2:'tag2',3:'tag3',4:'tag4'}[item.type]"-->
-                <!--                                    style="margin-right: 11px; margin-top: 16px"-->
-                <!--                                >-->
-                <!--                                  {{ item.name }}-->
-                <!--                                </div>-->
-              </div>
-              <div
-                  class="progressBox"
-                  :style="{ display: value.type === 1 ? 'block' : 'none' }"
-              >
-                <div>当前进度</div>
-                <div class="progress">
-                  <div style="width: 291px">
-                    <el-progress
-                        :percentage="value.currentRatio"
-                        :show-text="false"
-                        :stroke-width="8"
-                        :color="
-                        {
-                          0: 'rgba(238, 112, 108, 1)',
-                          1: 'rgba(255, 151, 38, 1)',
-                          2: 'rgba(39, 122, 255, 1)',
-                          3: 'rgba(59, 94, 251, 1)',
-                          4: 'rgba(57, 219, 183, 1)',
-                          5: 'rgba(57, 219, 183, 1)',
-                        }[parseInt(value.currentRatio / 20)]
-                      "
-                    />
-                  </div>
-                  <div
-                      style="
+								<!--                                <div-->
+								<!--                                    v-for="(item, key) in value.flag"-->
+								<!--                                    :key="key"-->
+								<!--                                    :class="{1:'tag1',2:'tag2',3:'tag3',4:'tag4'}[item.type]"-->
+								<!--                                    style="margin-right: 11px; margin-top: 16px"-->
+								<!--                                >-->
+								<!--                                  {{ item.name }}-->
+								<!--                                </div>-->
+							</div>
+							<div class="progressBox" :style="{ display: value.type === 1 ? 'block' : 'none' }">
+								<div>当前进度</div>
+								<div class="progress">
+									<div style="width: 291px">
+										<el-progress :percentage="value.currentRatio" :show-text="false" :stroke-width="8" :color="
+											{
+												0: 'rgba(238, 112, 108, 1)',
+												1: 'rgba(255, 151, 38, 1)',
+												2: 'rgba(39, 122, 255, 1)',
+												3: 'rgba(59, 94, 251, 1)',
+												4: 'rgba(57, 219, 183, 1)',
+												5: 'rgba(57, 219, 183, 1)',
+											}[parseInt(value.currentRatio / 20)]
+										" />
+									</div>
+									<div style="
                       font-size: 14px;
                       font-weight: 500;
                       color: #277aff;
                       margin-left: 10px;
-                    "
-                      :style="{
-                      color: {
-                        0: 'rgba(238, 112, 108, 1)',
-                        1: 'rgba(255, 151, 38, 1)',
-                        2: 'rgba(39, 122, 255, 1)',
-                        3: 'rgba(59, 94, 251, 1)',
-                        4: 'rgba(57, 219, 183, 1)',
-                        5: 'rgba(57, 219, 183, 1)',
-                      }[parseInt(value.currentRatio / 20)],
-                    }"
-                  >
-                    {{ value.currentRatio }}%
-                  </div>
-                </div>
-              </div>
-            </div>
-            <div
-                class="goclass"
-                :style="{
-                background: `${types.path[value.type] ? '#2478ff' : '#999'}`,
-              }"
-                @click="toFinish(value)"
-            >
-              {{
-                value.status === 1
-                    ? "已完成"
-                    : types.path[value.type]
-                        ? types.toName[value.type]
-                        : "未开放"
-              }}
-            </div>
-            <!--            <div :style="{ display: value.status === 1 ? 'block' : 'none' }">-->
-            <!--              <div-->
-            <!--                  class="goclass"-->
-            <!--                  :style="{ display: value.currentRatio === 0 ? 'none' : 'flex' }">去上课-->
-            <!--              </div>-->
-            <!--              <img-->
-            <!--                  style="width: 76px; height: 76px; margin-right: 61px"-->
-            <!--                  :style="{ display: value.currentRatio === 0 ? 'flex' : 'none' }"-->
-            <!--                  src="../../assets/image/pathdetails/notstarted.png"-->
-            <!--              />-->
-            <!--            </div>-->
-          </div>
-        </div>
-        <!-- <div class="tag1">必修</div>
+                    " :style="{
+                    	color: {
+                    		0: 'rgba(238, 112, 108, 1)',
+                    		1: 'rgba(255, 151, 38, 1)',
+                    		2: 'rgba(39, 122, 255, 1)',
+                    		3: 'rgba(59, 94, 251, 1)',
+                    		4: 'rgba(57, 219, 183, 1)',
+                    		5: 'rgba(57, 219, 183, 1)',
+                    	}[parseInt(value.currentRatio / 20)],
+                    }">
+										{{ value.currentRatio }}%
+									</div>
+								</div>
+							</div>
+						</div>
+						<div class="goclass" :style="{
+							background: `${types.path[value.type] ? '#2478ff' : '#999'}`,
+						}" @click="toFinish(value)">
+							{{
+									value.status === 1
+										? "已完成"
+										: types.path[value.type]
+											? types.toName[value.type]
+											: "未开放"
+							}}
+						</div>
+						<!--            <div :style="{ display: value.status === 1 ? 'block' : 'none' }">-->
+						<!--              <div-->
+						<!--                  class="goclass"-->
+						<!--                  :style="{ display: value.currentRatio === 0 ? 'none' : 'flex' }">去上课-->
+						<!--              </div>-->
+						<!--              <img-->
+						<!--                  style="width: 76px; height: 76px; margin-right: 61px"-->
+						<!--                  :style="{ display: value.currentRatio === 0 ? 'flex' : 'none' }"-->
+						<!--                  src="../../assets/image/pathdetails/notstarted.png"-->
+						<!--              />-->
+						<!--            </div>-->
+					</div>
+				</div>
+				<!-- <div class="tag1">必修</div>
         <div class="tag2">选修</div>
         <div class="tag3">测评</div>
         <div class="tag4">#通用力</div> -->
-      </div>
-      <div class="detailR">
-        <!--        todo #路径详情 课程公告及共享文档缺失-->
-        <!-- 课程公告及共享文档 -->
-        <div class="detailRT">
-          <el-tabs v-model="activeName" @tab-click="handleClick">
-            <el-tab-pane label="课程公告" name="first">
-              <div class="notice">
-                {{ data.remark || "暂无公告" }}
-              </div>
-            </el-tab-pane>
-            <!--
+			</div>
+			<div class="detailR">
+				<!--        todo #路径详情 课程公告及共享文档缺失-->
+				<!-- 课程公告及共享文档 -->
+				<div class="detailRT">
+					<el-tabs v-model="activeName" @tab-click="handleClick">
+						<el-tab-pane label="课程公告" name="first">
+							<div class="notice">
+								{{ data.remark || "暂无公告" }}
+							</div>
+						</el-tab-pane>
+						<!--
             <el-tab-pane label="共享文档" name="second">    -->
-            <!--              <div style="padding: 19px 30px 17px 28px">-->
-            <!--                <div-->
-            <!--                    v-for="(value, index) in sharedoc"-->
-            <!--                    :key="index"-->
-            <!--                    style="-->
-            <!--                    display: flex;-->
-            <!--                    align-items: center;-->
-            <!--                    margin-bottom: 15px;-->
-            <!--                  "-->
-            <!--                >-->
-            <!--                  <img :src="value.img" style="width: 22px; height: 26px"/>-->
-            <!--                  <div class="sharedocname">{{ value.name }}</div>-->
-            <!--                  <div class="download">-->
-            <!--                    <img-->
-            <!--                        src="../../assets/image/download.png"-->
-            <!--                        style="width: 16px; height: 15px"-->
-            <!--                    />-->
-            <!--                    <div style="margin-left: 7px">下载</div>-->
-            <!--                  </div>-->
-            <!--                </div>-->
-            <!--              </div>-->
-            <!--   </el-tab-pane>-->
-          </el-tabs>
-        </div>
-        <!-- 课程公告及共享文档 -->
-        <!-- 个人信息及学习进度 -->
-        <div class="detailRB">
-          <div class="info">
-            <div class="title">
-              <img
-                  style="width: 21px; height: 20px"
-                  src="../../assets/image/pathdetails/info.png"
-              />
-              <div class="text" style="margin-left: 7px">个人信息</div>
-              <div class="box"></div>
-            </div>
-            <!--            todo #路径详情 个人信息缺少img和介绍-->
-            <div
-                class="teacheritem"
-                :style="{ 'border-bottom': '1px solid rgba(56, 125, 247, 0.2)' }"
-            >
-              <img class="peopleimg" :src="userInfo.avatar"/>
-              <div style="margin-left: 17px">
-                <div class="teacherName">
-                  <div style="margin-right: 5px">
-                    {{ userInfo?.realName }}
-                  </div>
-                  <!--                  <div v-for="(item, key) in data.userInfoBo?.medal" :key="key">-->
-                  <!--                    <img class="teacherMedal" :src="item"/>-->
-                  <!--                  </div>-->
-                </div>
-                <div class="introduce">{{ userInfo?.bandDesc }}</div>
-              </div>
-            </div>
-          </div>
-          <div class="info" style="padding-top: 20px">
-            <div class="title">
-              <img
-                  style="width: 18px; height: 17px"
-                  src="../../assets/image/pathdetails/study.png"
-              />
-              <div class="text" style="margin-left: 9px">学习进度</div>
-              <div class="box"></div>
-            </div>
-            <!--
+						<!--              <div style="padding: 19px 30px 17px 28px">-->
+						<!--                <div-->
+						<!--                    v-for="(value, index) in sharedoc"-->
+						<!--                    :key="index"-->
+						<!--                    style="-->
+						<!--                    display: flex;-->
+						<!--                    align-items: center;-->
+						<!--                    margin-bottom: 15px;-->
+						<!--                  "-->
+						<!--                >-->
+						<!--                  <img :src="value.img" style="width: 22px; height: 26px"/>-->
+						<!--                  <div class="sharedocname">{{ value.name }}</div>-->
+						<!--                  <div class="download">-->
+						<!--                    <img-->
+						<!--                        src="../../assets/image/download.png"-->
+						<!--                        style="width: 16px; height: 15px"-->
+						<!--                    />-->
+						<!--                    <div style="margin-left: 7px">下载</div>-->
+						<!--                  </div>-->
+						<!--                </div>-->
+						<!--              </div>-->
+						<!--   </el-tab-pane>-->
+					</el-tabs>
+				</div>
+				<!-- 课程公告及共享文档 -->
+				<!-- 个人信息及学习进度 -->
+				<div class="detailRB">
+					<div class="info">
+						<div class="title">
+							<img style="width: 21px; height: 20px" src="../../assets/image/pathdetails/info.png" />
+							<div class="text" style="margin-left: 7px">个人信息</div>
+							<div class="box"></div>
+						</div>
+						<!--            todo #路径详情 个人信息缺少img和介绍-->
+						<div class="teacheritem" :style="{ 'border-bottom': '1px solid rgba(56, 125, 247, 0.2)' }">
+							<img class="peopleimg" :src="userInfo.avatar" />
+							<div style="margin-left: 17px">
+								<div class="teacherName">
+									<div style="margin-right: 5px">
+										{{ userInfo?.realName }}
+									</div>
+									<!--                  <div v-for="(item, key) in data.userInfoBo?.medal" :key="key">-->
+									<!--                    <img class="teacherMedal" :src="item"/>-->
+									<!--                  </div>-->
+								</div>
+								<div class="introduce">{{ userInfo?.bandDesc }}</div>
+							</div>
+						</div>
+					</div>
+					<div class="info" style="padding-top: 20px">
+						<div class="title">
+							<img style="width: 18px; height: 17px" src="../../assets/image/pathdetails/study.png" />
+							<div class="text" style="margin-left: 9px">学习进度</div>
+							<div class="box"></div>
+						</div>
+						<!--
             <div class="rate">
               <div class="ratetext">上次学到：{{ data.lastLearned }}</div>
               <div class="ratebtn">继续学习</div>
             </div>-->
-            <div style="margin-top: 16px">
-              <div class="progressBox">
-                <div>总进度</div>
-                <div class="progress">
-                  <div style="width: 291px">
-                    <el-progress
-                        :percentage="parseInt(data.currentChapterCnt/data.totalChapterCnt * 100)"
-                        :show-text="false"
-                        :stroke-width="8"
-                        :color="
-                        {
-                          0: 'rgba(238, 112, 108, 1)',
-                          1: 'rgba(255, 151, 38, 1)',
-                          2: 'rgba(39, 122, 255, 1)',
-                          3: 'rgba(59, 94, 251, 1)',
-                          4: 'rgba(57, 219, 183, 1)',
-                          5: 'rgba(57, 219, 183, 1)',
-                        }[(parseInt(data.currentChapterCnt/data.totalChapterCnt)* 100) / 20]
-                      "
-                    />
-                  </div>
-                  <div
-                      style="font-size: 14px; font-weight: 500; margin-left: 10px"
-                      :style="{
-                      color: {
-                        0: 'rgba(238, 112, 108, 1)',
-                        1: 'rgba(255, 151, 38, 1)',
-                        2: 'rgba(39, 122, 255, 1)',
-                        3: 'rgba(59, 94, 251, 1)',
-                        4: 'rgba(57, 219, 183, 1)',
-                        5: 'rgba(57, 219, 183, 1)',
-                      }[parseInt((data.currentChapterCnt/data.totalChapterCnt * 100) / 20)],
-                    }"
-                  >
-                    {{ parseInt(data.currentChapterCnt/data.totalChapterCnt * 100) }}%
-                  </div>
-                </div>
-              </div>
-            </div>
-            <div style="margin-top: 31px">
-              <div class="progressBox">
-                <div>必修进度</div>
-                <div class="progress">
-                  <div style="width: 291px">
-                    <el-progress
-                        :percentage="parseInt(data.currentReqCnt/data.totalReqCnt * 100)"
-                        :show-text="false"
-                        :stroke-width="8"
-                        :color="
-                        {
-                          0: 'rgba(238, 112, 108, 1)',
-                          1: 'rgba(255, 151, 38, 1)',
-                          2: 'rgba(39, 122, 255, 1)',
-                          3: 'rgba(59, 94, 251, 1)',
-                          4: 'rgba(57, 219, 183, 1)',
-                          5: 'rgba(57, 219, 183, 1)',
-                        }[parseInt((data.currentReqCnt/data.totalReqCnt * 100) / 20)]
-                      "
-                    />
-                  </div>
-                  <div
-                      style="
+						<div style="margin-top: 16px">
+							<div class="progressBox">
+								<div>总进度</div>
+								<div class="progress">
+									<div style="width: 291px">
+										<el-progress :percentage="parseInt(data.currentChapterCnt / data.totalChapterCnt * 100)"
+											:show-text="false" :stroke-width="8" :color="
+												{
+													0: 'rgba(238, 112, 108, 1)',
+													1: 'rgba(255, 151, 38, 1)',
+													2: 'rgba(39, 122, 255, 1)',
+													3: 'rgba(59, 94, 251, 1)',
+													4: 'rgba(57, 219, 183, 1)',
+													5: 'rgba(57, 219, 183, 1)',
+												}[(parseInt(data.currentChapterCnt / data.totalChapterCnt) * 100) / 20]
+											" />
+									</div>
+									<div style="font-size: 14px; font-weight: 500; margin-left: 10px" :style="{
+										color: {
+											0: 'rgba(238, 112, 108, 1)',
+											1: 'rgba(255, 151, 38, 1)',
+											2: 'rgba(39, 122, 255, 1)',
+											3: 'rgba(59, 94, 251, 1)',
+											4: 'rgba(57, 219, 183, 1)',
+											5: 'rgba(57, 219, 183, 1)',
+										}[parseInt((data.currentChapterCnt / data.totalChapterCnt * 100) / 20)],
+									}">
+										{{ parseInt(data.currentChapterCnt / data.totalChapterCnt * 100) }}%
+									</div>
+								</div>
+							</div>
+						</div>
+						<div style="margin-top: 31px">
+							<div class="progressBox">
+								<div>必修进度</div>
+								<div class="progress">
+									<div style="width: 291px">
+										<el-progress :percentage="parseInt(data.currentReqCnt / data.totalReqCnt * 100)" :show-text="false"
+											:stroke-width="8" :color="
+												{
+													0: 'rgba(238, 112, 108, 1)',
+													1: 'rgba(255, 151, 38, 1)',
+													2: 'rgba(39, 122, 255, 1)',
+													3: 'rgba(59, 94, 251, 1)',
+													4: 'rgba(57, 219, 183, 1)',
+													5: 'rgba(57, 219, 183, 1)',
+												}[parseInt((data.currentReqCnt / data.totalReqCnt * 100) / 20)]
+											" />
+									</div>
+									<div style="
                       font-size: 14px;
                       font-weight: 500;
                       color: #277aff;
                       margin-left: 10px;
-                    "
-                      :style="{
-                      color: {
-                        0: 'rgba(238, 112, 108, 1)',
-                        1: 'rgba(255, 151, 38, 1)',
-                        2: 'rgba(39, 122, 255, 1)',
-                        3: 'rgba(59, 94, 251, 1)',
-                        4: 'rgba(57, 219, 183, 1)',
-                        5: 'rgba(57, 219, 183, 1)',
-                      }[parseInt((data.currentReqCnt/data.totalReqCnt * 100) / 20)],
-                    }"
-                  >
-                    {{ parseInt(data.currentReqCnt/data.totalReqCnt * 100) }}%
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-        <!-- 个人信息及学习进度 -->
-      </div>
-    </div>
-    <!-- 详细信息 -->
-    <!-- 弹框提示信息 -->
-		<el-dialog
-			title=""
-			top="347px"
-			v-model="dialogVisible"
-			:show-close="false"
+                    " :style="{
+                    	color: {
+                    		0: 'rgba(238, 112, 108, 1)',
+                    		1: 'rgba(255, 151, 38, 1)',
+                    		2: 'rgba(39, 122, 255, 1)',
+                    		3: 'rgba(59, 94, 251, 1)',
+                    		4: 'rgba(57, 219, 183, 1)',
+                    		5: 'rgba(57, 219, 183, 1)',
+                    	}[parseInt((data.currentReqCnt / data.totalReqCnt * 100) / 20)],
+                    }">
+										{{ parseInt(data.currentReqCnt / data.totalReqCnt * 100) }}%
+									</div>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+				<!-- 个人信息及学习进度 -->
+			</div>
+		</div>
+		<!-- 详细信息 -->
+		<!-- 弹框提示信息 -->
+		<el-dialog title="" top="347px" v-model="dialogVisible" :show-close="false"
 			style="display:flex;justify-content:center;align-items:center;height: 283px;padding:0;border-radius: 4px;"
 			width="502px">
 			<div style="width:288px;color:#333333;font-size: 22px;font-weight: 600;">{{ dialogVisibleTip }}</div>
 			<span slot="footer" style="display:inline-block;margin-top:60px;">
 				<el-button @click="dialogVisible = false" style="width:140px;height:40px;margin-right: 22px;">取消</el-button>
-				<el-button type="primary" @click="dialogVisible = false"  style="width:140px;height:40px;">确定</el-button>
+				<el-button type="primary" @click="dialogVisible = false" style="width:140px;height:40px;">确定</el-button>
 			</span>
 		</el-dialog>
-  </div>
+	</div>
 </template>
 
 <script setup>
-import {computed, reactive, ref, watch} from "vue";
+import { computed, reactive, ref, watch } from "vue";
 import circle from '../../assets/image/pathdetails/circle.png';
 import circle2 from '../../assets/image/pathdetails/circle2.png';
-import {boeRequest, useRequest, request} from "@/api/request";
-import {ROUTER_PROCESS, LINK_DETAILS, STUDY_RECORD} from "@/api/api";
-import {useRoute, useRouter} from "vue-router";
-import {ElMessage} from "element-plus";
+import { boeRequest, useRequest, request } from "@/api/request";
+import { ROUTER_PROCESS, LINK_DETAILS, STUDY_RECORD } from "@/api/api";
+import { useRoute, useRouter } from "vue-router";
+import { ElMessage } from "element-plus";
 import store from "@/store";
 
 const {
-  query: {routerId, routerName},
+	query: { routerId, routerName },
 } = useRoute();
 const router = useRouter();
 const returnclick = () => {
-  router.back();
+	router.back();
 };
-const {data} = useRequest(ROUTER_PROCESS, {routerId});
+const { data } = useRequest(ROUTER_PROCESS, { routerId });
 const userInfo = computed(() => store.state.userInfo);
-
+console.log('lalalallala', data)
 const activeName = ref("first");
 
 const handleClick = (tab, event) => {
-  console.log(tab, event);
+	console.log(tab, event);
 };
-const path = {1: "path"};
+const path = { 1: "path" };
 
 const dialogVisible = ref(false);
 const dialogVisibleTip = ref('');
 
 function introductionPro() {
-	dialogVisibleTip.value =data.value.remark;
+	dialogVisibleTip.value = data.value.chapterRemark ? data.value.chapterRemark : '暂无说明';
 	dialogVisible.value = true;
 }
 
 const types = ref({
-  typeName: {
-    1: "在线",
-    2: "面授",
-    3: "案例",
-    4: "作业",
-    5: "考试",
-    6: "直播",
-    7: "外链",
-    8: "讨论",
-    9: "活动",
-    10: "测评",
-    11: "评估",
-    12: "投票",
-    13: "项目",
-  },
-  toName: {
-    1: "去上课",
-    2: "去上课",
-    3: "去阅读",
-    4: "去完成",
-    5: "去完成",
-    6: "去观看",
-    7: "去查看",
-    8: "去讨论",
-    9: "去签到",
-    10: "去完成",
-    11: "去完成",
-    12: "去投票",
-    13: "去完成",
-  },
-  path: {
-    1: import.meta.env.VITE_BOE_ONLINE_CLASS_URL, //在线
-    2: "/faceteach",
-    3: import.meta.env.VITE_BOE_CASS_DETAIL_URL, //案例
-    4: "/homeworkpage",
-    5: import.meta.env.VITE_BOE_EXAM_DETAIL_URL, //考试
-    6: "/livebroadcast",
-    7: ({courseId}) =>
-        request(LINK_DETAILS(courseId), {}).then(({data: {linkAddress}}) =>
-            window.open(linkAddress)
-        ), //外联
-    8: "/discusspage",
-    9: "/moreactive",
-    10: ({evaType, targetId}) =>
-        window.open(
-            (evaType == 0
-                ? import.meta.env.VITE_BOE_TEST_DETAIL_URL
-                : import.meta.env.VITE_BOE_TEST_OUT_DETAIL_URL) + targetId
-        ), //测评
-    11: "/surveydetail",
-    12: "/ballotpage",
-    13: "/projectdetails",
-  },
+	typeName: {
+		1: "在线",
+		2: "面授",
+		3: "案例",
+		4: "作业",
+		5: "考试",
+		6: "直播",
+		7: "外链",
+		8: "讨论",
+		9: "活动",
+		10: "测评",
+		11: "评估",
+		12: "投票",
+		13: "项目",
+	},
+	toName: {
+		1: "去上课",
+		2: "去上课",
+		3: "去阅读",
+		4: "去完成",
+		5: "去完成",
+		6: "去观看",
+		7: "去查看",
+		8: "去讨论",
+		9: "去签到",
+		10: "去完成",
+		11: "去完成",
+		12: "去投票",
+		13: "去完成",
+	},
+	path: {
+		1: import.meta.env.VITE_BOE_ONLINE_CLASS_URL, //在线
+		2: "/faceteach",
+		3: import.meta.env.VITE_BOE_CASS_DETAIL_URL, //案例
+		4: "/homeworkpage",
+		5: import.meta.env.VITE_BOE_EXAM_DETAIL_URL, //考试
+		6: "/livebroadcast",
+		7: ({ courseId }) =>
+			request(LINK_DETAILS(courseId), {}).then(({ data: { linkAddress } }) =>
+				window.open(linkAddress)
+			), //外联
+		8: "/discusspage",
+		9: "/moreactive",
+		10: ({ evaType, targetId }) =>
+			window.open(
+				(evaType == 0
+					? import.meta.env.VITE_BOE_TEST_DETAIL_URL
+					: import.meta.env.VITE_BOE_TEST_OUT_DETAIL_URL) + targetId
+			), //测评
+		11: "/surveydetail",
+		12: "/ballotpage",
+		13: "/projectdetails",
+	},
 });
 
 function toFinish(d) {
-  if (!types.value.path[d.type]) {
-    ElMessage.error("暂时未开放");
-    return;
-  }
-  if (d.type === 3 || d.type === 7) {
-    request(STUDY_RECORD, {
-      studentId: userInfo.value.id,
-      targetId: data.value.routerId,
-      logo: 1,
-      stageOrChapterId: data.value.currentStageId,
-      taskId: d.routerTaskId,
-    });
-  }
-  if (typeof types.value.path[d.type] === "string") {
-    types.value.path[d.type] &&
-    types.value.path[d.type].startsWith("http") &&
-    window.open(types.value.path[d.type] + d.targetId);
-    types.value.path[d.type] &&
-    types.value.path[d.type].startsWith("/") &&
-    router.push({
-      path: types.value.path[d.type],
-      query: {
-        id: d.routerTaskId,
-        type: 1,
-        courseId: d.courseId,
-        pName: data.value.name,
-        sName:data.value.currentStageName,
-      },
-    });
-  } else if (typeof types.value.path[d.type] === "function") {
-    console.log("ddddddd", d);
-    types.value.path[d.type](d);
-    // console.log("types.value.path[d.type](d)", d);
-  }
+	if (!types.value.path[d.type]) {
+		ElMessage.error("暂时未开放");
+		return;
+	}
+	if (d.type === 3 || d.type === 7) {
+		request(STUDY_RECORD, {
+			studentId: userInfo.value.id,
+			targetId: data.value.routerId,
+			logo: 1,
+			stageOrChapterId: data.value.currentStageId,
+			taskId: d.routerTaskId,
+		});
+	}
+	if (typeof types.value.path[d.type] === "string") {
+		types.value.path[d.type] &&
+			types.value.path[d.type].startsWith("http") &&
+			window.open(types.value.path[d.type] + d.targetId);
+		types.value.path[d.type] &&
+			types.value.path[d.type].startsWith("/") &&
+			router.push({
+				path: types.value.path[d.type],
+				query: {
+					id: d.routerTaskId,
+					type: 1,
+					courseId: d.courseId,
+					pName: data.value.name,
+					sName: data.value.currentStageName,
+				},
+			});
+	} else if (typeof types.value.path[d.type] === "function") {
+		console.log("ddddddd", d);
+		types.value.path[d.type](d);
+		// console.log("types.value.path[d.type](d)", d);
+	}
 }
 
 function whiteTypes(type) {
-  return import.meta.env.VITE_TASK_WHITE_TYPE.includes("-" + type + "-");
+	return import.meta.env.VITE_TASK_WHITE_TYPE.includes("-" + type + "-");
 }
 </script>
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style lang="scss">
 .pathdetails {
-  .crumb {
-    color: #fff;
-    display: flex;
-    font-size: 14px;
-    line-height: 24px;
-  }
+	.crumb {
+		color: #fff;
+		display: flex;
+		font-size: 14px;
+		line-height: 24px;
+	}
 
-  .pdname {
-    font-size: 20px;
-    font-weight: 800;
-    color: #ffffff;
-    margin-top: 17px;
-  }
+	.pdname {
+		font-size: 20px;
+		font-weight: 800;
+		color: #ffffff;
+		margin-top: 17px;
+	}
 
-  .detailinfo {
-    width: 100%;
-    margin-top: 24px;
-    display: flex;
+	.detailinfo {
+		width: 100%;
+		margin-top: 24px;
+		display: flex;
 
-    .detailL {
-      flex: 1;
-      margin-right: 20px;
-      background: #ffffff;
-      border-radius: 8px;
-      padding-left: 45px;
-      padding-right: 45px;
-      padding-top: 23px;
+		.detailL {
+			flex: 1;
+			margin-right: 20px;
+			background: #ffffff;
+			border-radius: 8px;
+			padding-left: 45px;
+			padding-right: 45px;
+			padding-top: 23px;
 
-      .title {
-        height: 50px;
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        background-color: rgba(249, 249, 249, 1);
-        margin-top: 27px;
-        margin-bottom: 19px;
+			.title {
+				height: 50px;
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				background-color: rgba(249, 249, 249, 1);
+				margin-top: 27px;
+				margin-bottom: 19px;
 
-        .titleL {
-          font-size: 16px;
-          font-weight: 800;
-          color: #333333;
-          margin-left: 27px;
-        }
+				.titleL {
+					font-size: 16px;
+					font-weight: 800;
+					color: #333333;
+					margin-left: 27px;
+				}
 
-        .titleR {
-          display: flex;
-          align-items: center;
-        }
+				.titleR {
+					display: flex;
+					align-items: center;
+				}
 
-        .titleR .titleRT {
-          font-size: 16px;
-          font-weight: 800;
-          color: #0060ff;
-          margin-right: 73px;
-          margin-left: 2px;
-        }
-      }
+				.titleR .titleRT {
+					font-size: 16px;
+					font-weight: 800;
+					color: #0060ff;
+					margin-right: 73px;
+					margin-left: 2px;
+				}
+			}
 
-      .course {
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        flex-wrap: wrap;
-        margin-bottom: 32px;
-        margin-left: 26px;
+			.course {
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				flex-wrap: wrap;
+				margin-bottom: 32px;
+				margin-left: 26px;
 
-        .coursename {
-          font-size: 14px;
-          font-weight: 500;
-          color: #333330;
-          line-height: 24px;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          white-space: nowrap;
-        }
+				.coursename {
+					font-size: 14px;
+					font-weight: 500;
+					color: #333330;
+					line-height: 24px;
+					overflow: hidden;
+					text-overflow: ellipsis;
+					white-space: nowrap;
+				}
 
-        .coursetag {
-          display: flex;
-          flex-wrap: wrap;
-        }
+				.coursetag {
+					display: flex;
+					flex-wrap: wrap;
+				}
 
-        .progressBox {
-          font-size: 14px;
-          font-weight: 500;
-          color: #677d86;
-          margin-top: 24px;
+				.progressBox {
+					font-size: 14px;
+					font-weight: 500;
+					color: #677d86;
+					margin-top: 24px;
 
-          .progress {
-            display: flex;
-            align-items: center;
-          }
+					.progress {
+						display: flex;
+						align-items: center;
+					}
 
-          .progress .el-progress-bar__outer {
-            background-color: rgba(232, 241, 254, 1);
-          }
-        }
+					.progress .el-progress-bar__outer {
+						background-color: rgba(232, 241, 254, 1);
+					}
+				}
 
-        .goclass {
-          width: 126px;
-          height: 46px;
-          background: #2478ff;
-          box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
-          border-radius: 4px;
-          font-size: 16px;
-          font-weight: 800;
-          color: #ffffff;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          margin-right: 37px;
-          cursor: pointer;
-        }
-      }
-    }
+				.goclass {
+					width: 126px;
+					height: 46px;
+					background: #2478ff;
+					box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
+					border-radius: 4px;
+					font-size: 16px;
+					font-weight: 800;
+					color: #ffffff;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					margin-right: 37px;
+					cursor: pointer;
+				}
+			}
+		}
 
-    .detailR {
-      width: 434px;
+		.detailR {
+			width: 434px;
 
-      .detailRT {
-        min-height: 298px;
-        background: #ffffff;
-        border-radius: 8px;
+			.detailRT {
+				min-height: 298px;
+				background: #ffffff;
+				border-radius: 8px;
 
-        .el-tabs__item {
-          height: 56px;
-          padding: 10px 33px 0px 27px;
-          font-size: 14px;
-          font-weight: 500;
-        }
+				.el-tabs__item {
+					height: 56px;
+					padding: 10px 33px 0px 27px;
+					font-size: 14px;
+					font-weight: 500;
+				}
 
-        .el-tabs__nav-wrap::after {
-          background-color: rgba(56, 125, 247, 0.2);
-        }
+				.el-tabs__nav-wrap::after {
+					background-color: rgba(56, 125, 247, 0.2);
+				}
 
-        .notice {
-          padding: 15px 43px 30px 47px;
-          font-size: 14px;
-          font-weight: 500;
-          color: #333330;
-          line-height: 24px;
-        }
+				.notice {
+					padding: 15px 43px 30px 47px;
+					font-size: 14px;
+					font-weight: 500;
+					color: #333330;
+					line-height: 24px;
+				}
 
-        .sharedocname {
-          width: 259px;
-          font-size: 14px;
-          font-weight: 400;
-          color: #677d86;
-          margin-left: 20px;
-          line-height: 24px;
-        }
+				.sharedocname {
+					width: 259px;
+					font-size: 14px;
+					font-weight: 400;
+					color: #677d86;
+					margin-left: 20px;
+					line-height: 24px;
+				}
 
-        .download {
-          display: flex;
-          align-items: center;
-          margin-left: 20px;
-          cursor: pointer;
-          font-size: 16px;
-          font-weight: 400;
-          color: #2478ff;
-        }
-      }
+				.download {
+					display: flex;
+					align-items: center;
+					margin-left: 20px;
+					cursor: pointer;
+					font-size: 16px;
+					font-weight: 400;
+					color: #2478ff;
+				}
+			}
 
-      .detailRB {
-        min-height: 459px;
-        background: #ffffff;
-        border-radius: 8px;
-        margin-top: 17px;
+			.detailRB {
+				min-height: 459px;
+				background: #ffffff;
+				border-radius: 8px;
+				margin-top: 17px;
 
-        .info .title {
-          display: flex;
-          align-items: center;
-          padding-top: 39px;
-          position: relative;
-          margin-left: 48px;
-        }
+				.info .title {
+					display: flex;
+					align-items: center;
+					padding-top: 39px;
+					position: relative;
+					margin-left: 48px;
+				}
 
-        .info .title .text {
-          margin-left: 8px;
-          font-size: 16px;
-          color: rgba(51, 51, 51, 1);
-          font-weight: 800;
-        }
+				.info .title .text {
+					margin-left: 8px;
+					font-size: 16px;
+					color: rgba(51, 51, 51, 1);
+					font-weight: 800;
+				}
 
-        .info .title .box {
-          width: 75px;
-          height: 10px;
-          background-color: rgba(36, 120, 255, 0.15);
-          position: absolute;
-          left: 23px;
-          top: 53px;
-        }
+				.info .title .box {
+					width: 75px;
+					height: 10px;
+					background-color: rgba(36, 120, 255, 0.15);
+					position: absolute;
+					left: 23px;
+					top: 53px;
+				}
 
-        .info .teacheritem {
-          margin-left: 48px;
-          margin-right: 48px;
-          margin-top: 30px;
-          display: flex;
-          // align-items: center;
-        }
+				.info .teacheritem {
+					margin-left: 48px;
+					margin-right: 48px;
+					margin-top: 30px;
+					display: flex;
+					// align-items: center;
+				}
 
-        .info .teacheritem .peopleimg {
-          width: 60px;
-          height: 60px;
-          border-radius: 30px;
-        }
+				.info .teacheritem .peopleimg {
+					width: 60px;
+					height: 60px;
+					border-radius: 30px;
+				}
 
-        .info .teacheritem .teacherName {
-          font-size: 14px;
-          font-weight: bold;
-          color: #394145;
-          display: flex;
-          align-items: center;
-          width: 260px;
-        }
+				.info .teacheritem .teacherName {
+					font-size: 14px;
+					font-weight: bold;
+					color: #394145;
+					display: flex;
+					align-items: center;
+					width: 260px;
+				}
 
-        .info .teacheritem .teacherName .teacherMedal {
-          width: 17px;
-          height: 19px;
-          margin-right: 4px;
-          display: flex;
-          align-items: center;
-        }
+				.info .teacheritem .teacherName .teacherMedal {
+					width: 17px;
+					height: 19px;
+					margin-right: 4px;
+					display: flex;
+					align-items: center;
+				}
 
-        .info .teacheritem .introduce {
-          width: 260px;
-          font-size: 14px;
-          font-weight: 500;
-          color: #394145;
-          margin-top: 14px;
-          line-height: 24px;
-        }
+				.info .teacheritem .introduce {
+					width: 260px;
+					font-size: 14px;
+					font-weight: 500;
+					color: #394145;
+					margin-top: 14px;
+					line-height: 24px;
+				}
 
-        .info .rate {
-          display: flex;
-          align-items: center;
-          justify-content: space-between;
-          margin-top: 29px;
-          margin-left: 48px;
-          margin-right: 26px;
-        }
+				.info .rate {
+					display: flex;
+					align-items: center;
+					justify-content: space-between;
+					margin-top: 29px;
+					margin-left: 48px;
+					margin-right: 26px;
+				}
 
-        .info .rate .ratetext {
-          width: 259px;
-          font-size: 14px;
-          font-weight: 500;
-          color: #677d86;
-          line-height: 24px;
-        }
+				.info .rate .ratetext {
+					width: 259px;
+					font-size: 14px;
+					font-weight: 500;
+					color: #677d86;
+					line-height: 24px;
+				}
 
-        .info .rate .ratebtn {
-          width: 86px;
-          height: 36px;
-          border: 1px solid #2478ff;
-          border-radius: 4px;
-          font-size: 14px;
-          font-weight: 500;
-          color: #2478ff;
-          line-height: 24px;
-          cursor: pointer;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-        }
+				.info .rate .ratebtn {
+					width: 86px;
+					height: 36px;
+					border: 1px solid #2478ff;
+					border-radius: 4px;
+					font-size: 14px;
+					font-weight: 500;
+					color: #2478ff;
+					line-height: 24px;
+					cursor: pointer;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+				}
 
-        .info .progressBox {
-          font-size: 14px;
-          font-weight: 500;
-          color: #677d86;
-          margin-top: 16px;
-          margin-left: 44px;
+				.info .progressBox {
+					font-size: 14px;
+					font-weight: 500;
+					color: #677d86;
+					margin-top: 16px;
+					margin-left: 44px;
 
-          .progress {
-            display: flex;
-            align-items: center;
-          }
+					.progress {
+						display: flex;
+						align-items: center;
+					}
 
-          .progress .el-progress-bar__outer {
-            background-color: rgba(232, 241, 254, 1);
-          }
-        }
-      }
-    }
-  }
+					.progress .el-progress-bar__outer {
+						background-color: rgba(232, 241, 254, 1);
+					}
+				}
+			}
+		}
+	}
 }
 </style>

From c16dfe57168b8305832370ade262e4d40e7d762a Mon Sep 17 00:00:00 2001
From: wuyx <wuyx@dongwu-inc.com>
Date: Fri, 23 Dec 2022 16:35:18 +0800
Subject: [PATCH 3/3] =?UTF-8?q?fix:=E5=A2=9E=E5=8A=A0=E9=9D=A2=E6=8E=88?=
 =?UTF-8?q?=E5=92=8C=E7=9B=B4=E6=92=AD=E4=BB=BB=E5=8A=A1=E6=9C=AA=E5=88=B0?=
 =?UTF-8?q?=E5=BC=80=E5=A7=8B=E6=97=B6=E9=97=B4=E6=8C=89=E9=92=AE=E7=81=B0?=
 =?UTF-8?q?=E8=89=B2=E7=82=B9=E5=87=BB=E6=8F=90=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/faceteach/FaceTeach.vue         | 1188 ++++++++++-----------
 src/views/liveBroadcast/LiveBroadcast.vue | 1106 ++++++++++---------
 2 files changed, 1111 insertions(+), 1183 deletions(-)

diff --git a/src/views/faceteach/FaceTeach.vue b/src/views/faceteach/FaceTeach.vue
index f55d9f7..deaa521 100644
--- a/src/views/faceteach/FaceTeach.vue
+++ b/src/views/faceteach/FaceTeach.vue
@@ -1,259 +1,190 @@
 <template>
-  <div class="faceteach" style="padding: 30px">
-    <!-- 面包屑导航 -->
-    <div class="crumb">
-      <div>课程列表</div>
-      <div style="margin-left: 6px; margin-right: 6px">/</div>
-      <div style="font-weight: 700">课程详情</div>
-      <div v-if="pName !=''" class="return">
-        <div style="display: flex" @click="returnclick">
-          <img
-            class="img2"
-            style="margin-right: 22px"
-            src="../../assets/image/return.png"
-          />
-          <div class="text">返回</div>
-        </div>
-      </div>
-    </div>
-    <!-- 面包屑导航 -->
+	<div class="faceteach" style="padding: 30px">
+		<!-- 面包屑导航 -->
+		<div class="crumb">
+			<div>课程列表</div>
+			<div style="margin-left: 6px; margin-right: 6px">/</div>
+			<div style="font-weight: 700">课程详情</div>
+			<div v-if="pName != ''" class="return">
+				<div style="display: flex" @click="returnclick">
+					<img class="img2" style="margin-right: 22px" src="../../assets/image/return.png" />
+					<div class="text">返回</div>
+				</div>
+			</div>
+		</div>
+		<!-- 面包屑导航 -->
 
-    <!-- 基本信息 -->
-    <div class="bascinfo">
-      <div style="margin-left: 46px">
-        <div class="title">【面授课】{{ data.planDto?.name }}</div>
-        <div class="time" style="margin-top: 26px">
-          <img
-            style="width: 15px; height: 17px"
-            src="../../assets/image/time.png"
-          />
-          <div style="margin-left: 8px">
-            {{ data.planDto?.beginTime + "至" + data.planDto?.endTime }}
-          </div>
-        </div>
-        <div class="time" style="margin-top: 23px">
-          <img
-            style="width: 16px; height: 18px"
-            src="../../assets/image/position.png"
-          />
-          <div style="margin-left: 8px">{{ data.planDto?.address }}</div>
-        </div>
-      </div>
-      <div style="display: flex">
-        <botton
-          v-if="!isAllowSign"
-          class="btn"
-          style="margin-right: 20px; background: #999"
-          @click="signClick"
-          >签到
-        </botton>
-        <botton
-          v-if="isAllowSign"
-          class="btn"
-          style="margin-right: 20px"
-          :style="{
-            background: data.signFlag ? '#999' : 'rgb(57, 146, 249)',
-          }"
-          @click="signClick"
-          >{{ data.signFlag ? "已签到" : "签到" }}
-        </botton>
-        <botton
-          style="background: #999"
-          class="btn"
-          @click="toSurvery"
-          v-if="data.planDto?.evalFlag == 0"
-        >
-          评估
-        </botton>
-        <botton
-          :style="{
-            background: `${new Date(data.planDto.beginTime).getTime()>new Date().getTime()? '#999' : data.isSurvery ? '#999' : 'rgb(57, 146, 249)'}`,
-          }"
-          class="btn"
-          @click="toSurvery"
-          v-if="data.planDto?.evalFlag && data.planDto?.evalFlag == 1"
-          >{{ data.isSurvery ? "已评估" : "评估" }}
-        </botton>
-      </div>
-    </div>
-    <!-- 基本信息 -->
+		<!-- 基本信息 -->
+		<div class="bascinfo">
+			<div style="margin-left: 46px">
+				<div class="title">【面授课】{{ data.planDto?.name }}</div>
+				<div class="time" style="margin-top: 26px">
+					<img style="width: 15px; height: 17px" src="../../assets/image/time.png" />
+					<div style="margin-left: 8px">
+						{{ data.planDto?.beginTime + "至" + data.planDto?.endTime }}
+					</div>
+				</div>
+				<div class="time" style="margin-top: 23px">
+					<img style="width: 16px; height: 18px" src="../../assets/image/position.png" />
+					<div style="margin-left: 8px">{{ data.planDto?.address }}</div>
+				</div>
+			</div>
+			<div style="display: flex">
+				<botton v-if="!isAllowSign" class="btn" style="margin-right: 20px; background: #999" @click="signClick">签到
+				</botton>
+				<botton v-if="isAllowSign" class="btn" style="margin-right: 20px" :style="{
+					background: data.signFlag ? '#999' : 'rgb(57, 146, 249)',
+				}" @click="signClick">{{ data.signFlag ? "已签到" : "签到" }}
+				</botton>
+				<botton style="background: #999" class="btn" @click="toSurvery" v-if="data.planDto?.evalFlag == 0">
+					评估
+				</botton>
+				<botton :style="{
+					background: `${new Date(data.planDto.beginTime).getTime() > new Date().getTime() ? '#999' : data.isSurvery ? '#999' : 'rgb(57, 146, 249)'}`,
+				}" class="btn" @click="toSurvery" v-if="data.planDto?.evalFlag && data.planDto?.evalFlag == 1">{{
+		data.isSurvery ? "已评估" : "评估"
+}}
+				</botton>
+			</div>
+		</div>
+		<!-- 基本信息 -->
 
-    <!-- 详细信息 -->
-    <div class="detailinfo">
-      <div class="detail">
-        <div class="detailT">
-          <div class="" style="margin-left: 48px; margin-right: 48px">
-            <div class="title">
-              <img
-                style="width: 20px; height: 20px"
-                src="../../assets/image/course.png"
-              />
-              <div class="text">课程详情</div>
-              <div class="box"></div>
-            </div>
-            <div style="display: flex; align-items: center">
-              <div class="content" v-html="data.planDto?.description"></div>
-            </div>
-          </div>
-        </div>
-        <div class="detailB">
-          <el-tabs v-model="activeName" @tab-click="handleClick">
-            <el-tab-pane label="课程附件" name="first">
-              <div
-                v-if="data.planDto?.attach === '[]'"
-                style="
+		<!-- 详细信息 -->
+		<div class="detailinfo">
+			<div class="detail">
+				<div class="detailT">
+					<div class="" style="margin-left: 48px; margin-right: 48px">
+						<div class="title">
+							<img style="width: 20px; height: 20px" src="../../assets/image/course.png" />
+							<div class="text">课程详情</div>
+							<div class="box"></div>
+						</div>
+						<div style="display: flex; align-items: center">
+							<div class="content" v-html="data.planDto?.description"></div>
+						</div>
+					</div>
+				</div>
+				<div class="detailB">
+					<el-tabs v-model="activeName" @tab-click="handleClick">
+						<el-tab-pane label="课程附件" name="first">
+							<div v-if="data.planDto?.attach === '[]'" style="
                   font-size: 14px;
                   font-weight: 400;
                   line-height: 24px;
                   cursor: pointer;
                   margin-left: 40px;
                   margin-top: 20px;
-                "
-              >
-                此课程无附件
-              </div>
-              <div
-                v-for="(el, index) in JSON.parse(data.planDto?.attach)"
-                :key="index"
-                v-if="data.planDto"
-                class="enclosure"
-                :style="{ borderBottom: '1px solid rgba(56, 125, 247, 0.2)' }"
-              >
-                <div class="enclosureL">
-                  <FileTypeImg
-                    v-model="el.name"
-                    :style="{
-                      width: '22px',
-                      height: '26px',
-                      marginLeft: '10px',
-                    }"
-                  ></FileTypeImg>
-                  <div style="margin-left: 20px">{{ el.name }}</div>
-                </div>
-                <div 
-                  v-if="new Date(data.planDto.beginTime).getTime() > new Date().getTime()"
-                  class="download">
-                  <img
-                    style="width: 16px; height: 15px"
-                    src="../../assets/image/download.png"
-                  />
-                  <div
-                    style="margin-left: 5px;color:#999;"
-                    @click="downloads(el.response.data)"
-                  >
-                    下载
-                  </div>
-                </div>
-                <div 
-                  v-else
-                  class="download">
-                  <img
-                    style="width: 16px; height: 15px"
-                    src="../../assets/image/download.png"
-                  />
-                  <div
-                    style="margin-left: 5px"
-                    @click="download(el.response.data)"
-                  >
-                    下载
-                  </div>
-                </div>
-              </div>
-            </el-tab-pane>
-            <el-tab-pane label="课程作业" name="second">
-              <div
-                v-if="data.planDto?.attach === '[]'"
-                style="
+                ">
+								此课程无附件
+							</div>
+							<div v-for="(el, index) in JSON.parse(data.planDto?.attach)" :key="index" v-if="data.planDto"
+								class="enclosure" :style="{ borderBottom: '1px solid rgba(56, 125, 247, 0.2)' }">
+								<div class="enclosureL">
+									<FileTypeImg v-model="el.name" :style="{
+										width: '22px',
+										height: '26px',
+										marginLeft: '10px',
+									}"></FileTypeImg>
+									<div style="margin-left: 20px">{{ el.name }}</div>
+								</div>
+								<div v-if="new Date(data.planDto.beginTime).getTime() > new Date().getTime()" class="download">
+									<img style="width: 16px; height: 15px" src="../../assets/image/download.png" />
+									<div style="margin-left: 5px;color:#999;" @click="downloads(el.response.data)">
+										下载
+									</div>
+								</div>
+								<div v-else class="download">
+									<img style="width: 16px; height: 15px" src="../../assets/image/download.png" />
+									<div style="margin-left: 5px" @click="download(el.response.data)">
+										下载
+									</div>
+								</div>
+							</div>
+						</el-tab-pane>
+						<el-tab-pane label="课程作业" name="second">
+							<div v-if="data.planDto?.attach === '[]'" style="
                   font-size: 14px;
                   font-weight: 400;
                   line-height: 24px;
                   cursor: pointer;
                   margin-left: 40px;
                   margin-top: 20px;
-                "
-              >
-                此课程无作业
-              </div>
-              <div class="work" v-if="data.workDto?.workName">
-                <div>
-                  <div class="question">{{ data.workDto?.workName }}</div>
-                  <div style="margin-top: 16px; display: flex">
-                    <div class="tag1" v-if="data.workDto?.workFlag">必修</div>
-                    <div class="tag3" style="margin-left: 11px">作业</div>
-                  </div>
-                </div>
-                
-                <div v-if="isEndSubMitWork()" class="submit" style="background: #999">
-                  已结束
-                </div>
-                <div 
-                  :style="{background: new Date(data.planDto.beginTime).getTime() > new Date().getTime()?'#999':''}"
-                  v-else class="submit" @click="toWork" v-if="data.workDto?.workId">
-                  交作业
-                </div>
-              </div>
-            </el-tab-pane>
-            <el-tab-pane label="课程考试" name="third">
-              <div
-                v-if="data.planDto?.attach === '[]'"
-                style="
+                ">
+								此课程无作业
+							</div>
+							<div class="work" v-if="data.workDto?.workName">
+								<div>
+									<div class="question">{{ data.workDto?.workName }}</div>
+									<div style="margin-top: 16px; display: flex">
+										<div class="tag1" v-if="data.workDto?.workFlag">必修</div>
+										<div class="tag3" style="margin-left: 11px">作业</div>
+									</div>
+								</div>
+
+								<div v-if="isEndSubMitWork()" class="submit" style="background: #999">
+									已结束
+								</div>
+								<div
+									:style="{ background: new Date(data.planDto.beginTime).getTime() > new Date().getTime() ? '#999' : '' }"
+									v-else class="submit" @click="toWork" v-if="data.workDto?.workId">
+									交作业
+								</div>
+							</div>
+						</el-tab-pane>
+						<el-tab-pane label="课程考试" name="third">
+							<div v-if="data.planDto?.attach === '[]'" style="
                   font-size: 14px;
                   font-weight: 400;
                   line-height: 24px;
                   cursor: pointer;
                   margin-left: 40px;
                   margin-top: 20px;
-                "
-              >
-                此课程无考试
-              </div>
-              <div class="work" v-if="data.examinationDto?.examinationTestName">
-                <div>
-                  <div class="question">
-                    {{ data.examinationDto?.examinationTestName }}
-                  </div>
-                  <div style="margin-top: 16px; display: flex">
-                    <div
-                      class="tag1"
-                      v-if="data.examinationDto?.examinationFlag"
-                    >
-                      必修
-                    </div>
-                    <div class="tag3" style="margin-left: 11px">考试</div>
-                  </div>
-                </div>
-                <div :style="{background: new Date(data.planDto.beginTime).getTime() > new Date().getTime()?'#999':''}" class="submit" @click="toExamItem(data.examinationDto)">
-                  去考试
-                </div>
-              </div>
-            </el-tab-pane>
-          </el-tabs>
-        </div>
-      </div>
-      <div class="teacher">
-        <div class="title">
-          <img
-            style="width: 21px; height: 23px"
-            src="../../assets/image/livelecturer.png"
-          />
-          <div class="text">面授课讲师</div>
-          <div class="box"></div>
-        </div>
-        <!--        todo #面授课接口 讲师缺少img和介绍-->
-        <div class="teacheritem">
-          <img class="peopleimg" :src="teacherInfo.avatar" />
-          <div style="margin-left: 17px; width: 190px">
-            <div class="teacherName" style="margin-right: 5px">
-              {{ data.planDto?.teacher }}
-            </div>
-            <div class="introduce">{{ data.planDto?.bandDesc }}</div>
-          </div>
-          <!--          <div class="follow">+ 关注</div>-->
-        </div>
-      </div>
-    </div>
-    <!-- 详细信息 -->
-  </div>
+                ">
+								此课程无考试
+							</div>
+							<div class="work" v-if="data.examinationDto?.examinationTestName">
+								<div>
+									<div class="question">
+										{{ data.examinationDto?.examinationTestName }}
+									</div>
+									<div style="margin-top: 16px; display: flex">
+										<div class="tag1" v-if="data.examinationDto?.examinationFlag">
+											必修
+										</div>
+										<div class="tag3" style="margin-left: 11px">考试</div>
+									</div>
+								</div>
+								<div
+									:style="{ background: new Date(data.planDto.beginTime).getTime() > new Date().getTime() ? '#999' : '' }"
+									class="submit" @click="toExamItem(data.examinationDto)">
+									去考试
+								</div>
+							</div>
+						</el-tab-pane>
+					</el-tabs>
+				</div>
+			</div>
+			<div class="teacher">
+				<div class="title">
+					<img style="width: 21px; height: 23px" src="../../assets/image/livelecturer.png" />
+					<div class="text">面授课讲师</div>
+					<div class="box"></div>
+				</div>
+				<!--        todo #面授课接口 讲师缺少img和介绍-->
+				<div class="teacheritem">
+					<img class="peopleimg" :src="teacherInfo.avatar" />
+					<div style="margin-left: 17px; width: 190px">
+						<div class="teacherName" style="margin-right: 5px">
+							{{ data.planDto?.teacher }}
+						</div>
+						<div class="introduce">{{ data.planDto?.bandDesc }}</div>
+					</div>
+					<!--          <div class="follow">+ 关注</div>-->
+				</div>
+			</div>
+		</div>
+		<!-- 详细信息 -->
+	</div>
 </template>
 
 <script setup>
@@ -261,479 +192,482 @@ import { computed, reactive, toRefs, watch, onUnmounted } from "vue";
 import FileTypeImg from "@/components/FileTypeImg.vue";
 import { request, useRequest } from "@/api/request";
 import {
-  STU_OFFCOURSE_DETAIL,
-  TASK_OFFCOURSE_NOTASK_SIGN,
-  TASK_OFFCOURSE_SIGN,
-  TASK_BROADCAST_SIGN,
+	STU_OFFCOURSE_DETAIL,
+	TASK_OFFCOURSE_NOTASK_SIGN,
+	TASK_OFFCOURSE_SIGN,
+	TASK_BROADCAST_SIGN,
 } from "@/api/api";
 import { useRoute, useRouter } from "vue-router";
 import { useUserInfo } from "@/api/utils";
 import { ElMessage, messageConfig } from "element-plus";
 const router = useRouter();
 const returnclick = () => {
-  router.back();
+	router.back();
 };
 const {
-  query: { courseId, type, id: taskId },
+	query: { courseId, type, id: taskId },
 } = useRoute();
 
 const { data } = useRequest(STU_OFFCOURSE_DETAIL, { courseId });
 console.log("datadatadatadatadatadatadata", data);
 const teacherInfo = useUserInfo(
-  computed(() => data.value?.planDto?.teacherId)
+	computed(() => data.value?.planDto?.teacherId)
 );
 
 const state = reactive({
-  activeName: "first",
-  enclosure: "",
-  isAllowSign: false,
+	activeName: "first",
+	enclosure: "",
+	isAllowSign: false,
 });
 const { activeName, enclosure, isAllowSign } = toRefs(state);
 const handleClick = (tab, event) => {
-  console.log(tab, event);
+	console.log(tab, event);
 };
 const download = (url) => {
-  window.open(url);
+	window.open(url);
 };
 const downloads = (url) => {
-  ElMessage.info("面授课未开始");
+	ElMessage.info("未到开始时间，请耐心等待！");
 };
 let timer = null;
 //判断能否签到
 function isSignClick() {
-  timer = setInterval(() => {
-    let beginTime = new Date(data.value.planDto.beginTime).getTime();
-    let endTime = !data.value.planDto.afterStart
-      ? new Date(data.value.planDto.endTime).getTime()
-      : new Date(data.value.planDto.beginTime).getTime();
-    let nowTime = new Date().getTime();
-    if (data.value.planDto.beforeStart && data.value.planDto.afterStart) {
-      //有开始前有开始后
-      beginTime = beginTime - data.value.planDto.beforeStart * 60 * 1000;
-      endTime = endTime + data.value.planDto.afterStart * 60 * 1000;
-      console.log("1111");
-    } else if (
-      data.value.planDto.beforeStart &&
-      !data.value.planDto.afterStart
-    ) {
-      //只有开始前无开始后
-      beginTime = beginTime - data.value.planDto.beforeStart * 60 * 1000;
-      console.log("11112222");
-    } else if (
-      !data.value.planDto.beforeStart &&
-      data.value.planDto.afterStart
-    ) {
-      //无开始前有开始后
-      endTime = endTime + data.value.planDto.afterStart * 60 * 1000;
-      console.log("1111333");
-    }
-    if (nowTime < endTime && nowTime > beginTime) {
-      state.isAllowSign = true;
-    } else {
-      state.isAllowSign = false;
-    }
-    // console.log(
-    //   "isAllowSign",
-    //   state.isAllowSign,
-    //   nowTime,
-    //   endTime,
-    //   beginTime,
-    //   nowTime < endTime,
-    //   nowTime > beginTime
-    // );
-  }, 1000);
+	timer = setInterval(() => {
+		let beginTime = new Date(data.value.planDto.beginTime).getTime();
+		let endTime = !data.value.planDto.afterStart
+			? new Date(data.value.planDto.endTime).getTime()
+			: new Date(data.value.planDto.beginTime).getTime();
+		let nowTime = new Date().getTime();
+		if (data.value.planDto.beforeStart && data.value.planDto.afterStart) {
+			//有开始前有开始后
+			beginTime = beginTime - data.value.planDto.beforeStart * 60 * 1000;
+			endTime = endTime + data.value.planDto.afterStart * 60 * 1000;
+			console.log("1111");
+		} else if (
+			data.value.planDto.beforeStart &&
+			!data.value.planDto.afterStart
+		) {
+			//只有开始前无开始后
+			beginTime = beginTime - data.value.planDto.beforeStart * 60 * 1000;
+			console.log("11112222");
+		} else if (
+			!data.value.planDto.beforeStart &&
+			data.value.planDto.afterStart
+		) {
+			//无开始前有开始后
+			endTime = endTime + data.value.planDto.afterStart * 60 * 1000;
+			console.log("1111333");
+		}
+		if (nowTime < endTime && nowTime > beginTime) {
+			state.isAllowSign = true;
+		} else {
+			state.isAllowSign = false;
+		}
+		// console.log(
+		//   "isAllowSign",
+		//   state.isAllowSign,
+		//   nowTime,
+		//   endTime,
+		//   beginTime,
+		//   nowTime < endTime,
+		//   nowTime > beginTime
+		// );
+	}, 1000);
 }
 isSignClick();
 
 //签到
 const signClick = () => {
-  if (data.value.signFlag) {
-    return;
-  }
-  // console.log(
-  //   "data.signFlag",
-  //   data.value.signFlag,
-  //   state.isAllowSign,
-  //   !state.isAllowSign
-  // );
-  if(data.value.planDto.beginTime){
-    let date1 = new Date(data.value.planDto.beginTime).getTime()
-    let date2 = new Date().getTime()
-    if(date1>date2){
-      ElMessage.info("面授课未开始");
-      return;
-    }
-  }
-  if (!state.isAllowSign) {
-    // console.log("data.signFlag", data.value.signFlag, isAllowSign);
-    ElMessage.info("未在签到范围内");
-    return;
-  }
-  2;
-  data.value.signFlag = 1;
-  ElMessage.info("签到成功");
+	if (data.value.signFlag) {
+		return;
+	}
+	// console.log(
+	//   "data.signFlag",
+	//   data.value.signFlag,
+	//   state.isAllowSign,
+	//   !state.isAllowSign
+	// );
+	if (data.value.planDto.beginTime) {
+		let date1 = new Date(data.value.planDto.beginTime).getTime()
+		let date2 = new Date().getTime()
+		if (date1 > date2) {
+			ElMessage.info("未到开始时间，请耐心等待！");
+			return;
+		}
+	}
+	if (!state.isAllowSign) {
+		// console.log("data.signFlag", data.value.signFlag, isAllowSign);
+		ElMessage.info("未在签到范围内");
+		return;
+	}
+	2;
+	data.value.signFlag = 1;
+	ElMessage.info("签到成功");
 
-  if (taskId) {
-    request(TASK_OFFCOURSE_SIGN, { courseId: courseId, taskId, type });
-  } else {
-    request(TASK_OFFCOURSE_NOTASK_SIGN, { courseId: courseId });
-  }
+	if (taskId) {
+		request(TASK_OFFCOURSE_SIGN, { courseId: courseId, taskId, type });
+	} else {
+		request(TASK_OFFCOURSE_NOTASK_SIGN, { courseId: courseId });
+	}
 };
 
 function toSurvery() {
-  if (data.value.isSurvery) {
-    // return;
-  }
-  if(data.value.planDto.beginTime){
-    let date1 = new Date(data.value.planDto.beginTime).getTime()
-    let date2 = new Date().getTime()
-    if(date1>date2){
-      ElMessage.info("面授课未开始");
-      return;
-    }
-  }
-  if (data.value.planDto.evalFlag == 0) {
-    ElMessage.info("此课程无评估");
-    return;
-  }
-  router.push({
-    path: "/surveydetail",
-    query: {
-      courseId: data.value.planDto.evaluateId,
-      pName: "面授课",
-      sName: data.value.planDto.name,
-    },
-  });
+	if (data.value.isSurvery) {
+		// return;
+	}
+	if (data.value.planDto.beginTime) {
+		let date1 = new Date(data.value.planDto.beginTime).getTime()
+		let date2 = new Date().getTime()
+		if (date1 > date2) {
+			ElMessage.info("未到开始时间，请耐心等待！");
+			return;
+		}
+	}
+	if (data.value.planDto.evalFlag == 0) {
+		ElMessage.info("此课程无评估");
+		return;
+	}
+	router.push({
+		path: "/surveydetail",
+		query: {
+			courseId: data.value.planDto.evaluateId,
+			pName: "面授课",
+			sName: data.value.planDto.name,
+		},
+	});
 }
 
 function isEndSubMitWork() {
-  if(data.value.workDto.submitEndTime){
-    let date1 = new Date(data.value.workDto.submitEndTime).getTime();
-    let date2 = new Date().getTime();
-    console.log(date1, date2, date1>date2, data.value.workDto.submitEndTime)
-    if(date1<date2){
-      return true;
-    }
-  }else{
-    return false;
-  }
+	if (data.value.workDto.submitEndTime) {
+		let date1 = new Date(data.value.workDto.submitEndTime).getTime();
+		let date2 = new Date().getTime();
+		console.log(date1, date2, date1 > date2, data.value.workDto.submitEndTime)
+		if (date1 < date2) {
+			return true;
+		}
+	} else {
+		return false;
+	}
 }
 
 function toWork() {
-  if(data.value.planDto.beginTime){
-    let date1 = new Date(data.value.planDto.beginTime).getTime()
-    let date2 = new Date().getTime()
-    if(date1>date2){
-      ElMessage.info("面授课未开始");
-      return;
-    }
-  }
-  router.push({
-    path: "/homeworkpage",
-    query: {
-      courseId: data.value.workDto.workId,
-      id: taskId,
-      type,
-      pName: "面授课",
-      sName: data.value.planDto.name,
-    },
-  });
+	if (data.value.planDto.beginTime) {
+		let date1 = new Date(data.value.planDto.beginTime).getTime()
+		let date2 = new Date().getTime()
+		if (date1 > date2) {
+			ElMessage.info("未到开始时间，请耐心等待！");
+			return;
+		}
+	}
+	router.push({
+		path: "/homeworkpage",
+		query: {
+			courseId: data.value.workDto.workId,
+			id: taskId,
+			type,
+			pName: "面授课",
+			sName: data.value.planDto.name,
+		},
+	});
 }
 
 function toExamItem(obj) {
-  if(data.value.planDto.beginTime){
-    let date1 = new Date(data.value.planDto.beginTime).getTime()
-    let date2 = new Date().getTime()
-    if(date1>date2){
-      ElMessage.info("面授课未开始");
-      return;
-    }
-  }
-  console.log("obj", obj.examinationTestId);
-  window.open(import.meta.env.VITE_BOE_EXAM_DETAIL_URL + obj.examinationTestId); //测评
-  // router.push({ path: import.meta.env.VITE_BOE_EXAM_DETAIL_URL+ obj.examinationTestId });
+	if (data.value.planDto.beginTime) {
+		let date1 = new Date(data.value.planDto.beginTime).getTime()
+		let date2 = new Date().getTime()
+		if (date1 > date2) {
+			ElMessage.info("未到开始时间，请耐心等待！");
+			return;
+		}
+	}
+	console.log("obj", obj.examinationTestId);
+	window.open(import.meta.env.VITE_BOE_EXAM_DETAIL_URL + obj.examinationTestId); //测评
+	// router.push({ path: import.meta.env.VITE_BOE_EXAM_DETAIL_URL+ obj.examinationTestId });
 }
 
 onUnmounted(() => {
-  if (timer) {
-    clearInterval(timer);
-  }
+	if (timer) {
+		clearInterval(timer);
+	}
 });
 </script>
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style lang="scss">
 .faceteach {
-  .crumb {
-    color: #fff;
-    display: flex;
-    font-size: 14px;
-    line-height: 24px;
-  }
+	.crumb {
+		color: #fff;
+		display: flex;
+		font-size: 14px;
+		line-height: 24px;
+	}
 
-  .bascinfo {
-    width: 100%;
-    height: 180px;
-    border-radius: 8px;
-    background-color: rgba(255, 255, 255, 1);
-    margin-top: 37px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
+	.bascinfo {
+		width: 100%;
+		height: 180px;
+		border-radius: 8px;
+		background-color: rgba(255, 255, 255, 1);
+		margin-top: 37px;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
 
-    .btn {
-      width: 146px;
-      height: 46px;
-      background: #2478ff;
-      border-radius: 4px;
-      box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      color: #fff;
-      font-size: 14px;
-      font-weight: 800;
-      line-height: 24px;
-      cursor: pointer;
-      margin-right: 96px;
-    }
+		.btn {
+			width: 146px;
+			height: 46px;
+			background: #2478ff;
+			border-radius: 4px;
+			box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			color: #fff;
+			font-size: 14px;
+			font-weight: 800;
+			line-height: 24px;
+			cursor: pointer;
+			margin-right: 96px;
+		}
 
-    .title {
-      font-size: 20px;
-      font-weight: 800;
-      color: #333333;
-      line-height: 24px;
-      margin-left: -9px;
-    }
+		.title {
+			font-size: 20px;
+			font-weight: 800;
+			color: #333333;
+			line-height: 24px;
+			margin-left: -9px;
+		}
 
-    .time {
-      font-size: 14px;
-      color: #6e7b84;
-      line-height: 24px;
-      display: flex;
-      align-items: center;
-    }
-  }
-  .return {
-    position: absolute;
-    right: 10%;
-    .text {
-      text-align: center;
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-    }
-  }
-  .detailinfo {
-    width: 100%;
-    margin-top: 20px;
-    display: flex;
-    align-items: flex-start;
+		.time {
+			font-size: 14px;
+			color: #6e7b84;
+			line-height: 24px;
+			display: flex;
+			align-items: center;
+		}
+	}
 
-    .detail {
-      flex: 1;
-      margin-right: 20px;
+	.return {
+		position: absolute;
+		right: 10%;
 
-      .detailT {
-        min-height: 263px;
-        background: #ffffff;
-        border-radius: 8px;
-        color: rgba(51, 51, 51, 1);
+		.text {
+			text-align: center;
+			display: flex;
+			flex-direction: row;
+			align-items: center;
+		}
+	}
 
-        .title {
-          display: flex;
-          align-items: center;
-          padding-top: 39px;
-          position: relative;
-        }
+	.detailinfo {
+		width: 100%;
+		margin-top: 20px;
+		display: flex;
+		align-items: flex-start;
 
-        .title .text {
-          margin-left: 8px;
-          font-size: 16px;
-          color: rgba(51, 51, 51, 1);
-          font-weight: 800;
-        }
+		.detail {
+			flex: 1;
+			margin-right: 20px;
 
-        .title .box {
-          width: 75px;
-          height: 10px;
-          background-color: rgba(36, 120, 255, 0.15);
-          position: absolute;
-          left: 23px;
-          top: 53px;
-        }
+			.detailT {
+				min-height: 263px;
+				background: #ffffff;
+				border-radius: 8px;
+				color: rgba(51, 51, 51, 1);
 
-        .content {
-          margin-left: 8px;
-          font-size: 14px;
-          color: rgba(51, 51, 48, 1);
-          font-weight: 500;
-          line-height: 35px;
-          margin-top: 30px;
-          padding-bottom: 30px;
-        }
-      }
+				.title {
+					display: flex;
+					align-items: center;
+					padding-top: 39px;
+					position: relative;
+				}
 
-      .detailB {
-        min-height: 363px;
-        background: #ffffff;
-        border-radius: 8px;
-        margin-top: 20px;
+				.title .text {
+					margin-left: 8px;
+					font-size: 16px;
+					color: rgba(51, 51, 51, 1);
+					font-weight: 800;
+				}
 
-        .el-tabs__item {
-          height: 69px;
-          padding: 25px 7px 0px 52px;
-          font-size: 14px;
-          font-weight: 500;
-        }
+				.title .box {
+					width: 75px;
+					height: 10px;
+					background-color: rgba(36, 120, 255, 0.15);
+					position: absolute;
+					left: 23px;
+					top: 53px;
+				}
 
-        .el-tabs__nav-wrap::after {
-          background-color: rgba(56, 125, 247, 0.2);
-        }
+				.content {
+					margin-left: 8px;
+					font-size: 14px;
+					color: rgba(51, 51, 48, 1);
+					font-weight: 500;
+					line-height: 35px;
+					margin-top: 30px;
+					padding-bottom: 30px;
+				}
+			}
 
-        .enclosure {
-          height: 89px;
-          margin-left: 51px;
-          margin-right: 40px;
-          // border-bottom: 1px solid rgba(56, 125, 247, 0.2);
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
+			.detailB {
+				min-height: 363px;
+				background: #ffffff;
+				border-radius: 8px;
+				margin-top: 20px;
 
-          .enclosureL {
-            display: flex;
-            align-items: center;
-            font-size: 14px;
-            font-weight: 400;
-            color: #677d86;
-            line-height: 24px;
-          }
+				.el-tabs__item {
+					height: 69px;
+					padding: 25px 7px 0px 52px;
+					font-size: 14px;
+					font-weight: 500;
+				}
 
-          .download {
-            display: flex;
-            align-items: center;
-            font-size: 16px;
-            font-weight: 400;
-            color: #2478ff;
-            line-height: 24px;
-            cursor: pointer;
-          }
-        }
+				.el-tabs__nav-wrap::after {
+					background-color: rgba(56, 125, 247, 0.2);
+				}
 
-        .work {
-          margin-left: 51px;
-          margin-right: 40px;
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          margin-top: 37px;
-        }
+				.enclosure {
+					height: 89px;
+					margin-left: 51px;
+					margin-right: 40px;
+					// border-bottom: 1px solid rgba(56, 125, 247, 0.2);
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
 
-        .work .question {
-          font-size: 14px;
-          font-weight: 500;
-          color: #333330;
-          line-height: 18px;
-        }
+					.enclosureL {
+						display: flex;
+						align-items: center;
+						font-size: 14px;
+						font-weight: 400;
+						color: #677d86;
+						line-height: 24px;
+					}
 
-        .work .submit {
-          width: 126px;
-          height: 46px;
-          background: #2478ff;
-          box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
-          border-radius: 4px;
-          font-size: 16px;
-          font-weight: 800;
-          color: #ffffff;
-          line-height: 24px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          cursor: pointer;
-        }
-      }
-    }
+					.download {
+						display: flex;
+						align-items: center;
+						font-size: 16px;
+						font-weight: 400;
+						color: #2478ff;
+						line-height: 24px;
+						cursor: pointer;
+					}
+				}
 
-    .teacher {
-      width: 434px;
-      min-height: 500px;
-      // height: 10%;
-      background-color: rgba(255, 255, 255, 1);
-      border-radius: 8px;
+				.work {
+					margin-left: 51px;
+					margin-right: 40px;
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					margin-top: 37px;
+				}
 
-      .title {
-        display: flex;
-        align-items: center;
-        padding-top: 39px;
-        position: relative;
-        margin-left: 48px;
-      }
+				.work .question {
+					font-size: 14px;
+					font-weight: 500;
+					color: #333330;
+					line-height: 18px;
+				}
 
-      .title .text {
-        margin-left: 8px;
-        font-size: 16px;
-        color: rgba(51, 51, 51, 1);
-        font-weight: 800;
-      }
+				.work .submit {
+					width: 126px;
+					height: 46px;
+					background: #2478ff;
+					box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
+					border-radius: 4px;
+					font-size: 16px;
+					font-weight: 800;
+					color: #ffffff;
+					line-height: 24px;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					cursor: pointer;
+				}
+			}
+		}
 
-      .title .box {
-        width: 75px;
-        height: 10px;
-        background-color: rgba(36, 120, 255, 0.15);
-        position: absolute;
-        left: 23px;
-        top: 53px;
-      }
+		.teacher {
+			width: 434px;
+			min-height: 500px;
+			// height: 10%;
+			background-color: rgba(255, 255, 255, 1);
+			border-radius: 8px;
 
-      .teacheritem {
-        margin-left: 48px;
-        margin-right: 48px;
-        // min-height: 115px;
-        padding: 25px 0px;
-        display: flex;
-        position: relative;
-        // align-items: center;
-      }
+			.title {
+				display: flex;
+				align-items: center;
+				padding-top: 39px;
+				position: relative;
+				margin-left: 48px;
+			}
 
-      .teacheritem .peopleimg {
-        width: 60px;
-        height: 60px;
-        border-radius: 30px;
-      }
+			.title .text {
+				margin-left: 8px;
+				font-size: 16px;
+				color: rgba(51, 51, 51, 1);
+				font-weight: 800;
+			}
 
-      .teacheritem .teacherName {
-        font-size: 14px;
-        font-weight: bold;
-        color: #394145;
-        display: flex;
-        align-items: center;
-      }
+			.title .box {
+				width: 75px;
+				height: 10px;
+				background-color: rgba(36, 120, 255, 0.15);
+				position: absolute;
+				left: 23px;
+				top: 53px;
+			}
 
-      .teacheritem .introduce {
-        font-size: 14px;
-        font-weight: 500;
-        color: #394145;
-        margin-top: 14px;
-      }
+			.teacheritem {
+				margin-left: 48px;
+				margin-right: 48px;
+				// min-height: 115px;
+				padding: 25px 0px;
+				display: flex;
+				position: relative;
+				// align-items: center;
+			}
 
-      .teacheritem .follow {
-        width: 80px;
-        height: 30px;
-        background: #387df7;
-        border-radius: 4px;
-        margin-top: 28px;
-        position: absolute;
-        right: -25px;
-        font-size: 14px;
-        font-weight: 500;
-        color: #ffffff;
-        line-height: 24px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        cursor: pointer;
-      }
-    }
-  }
+			.teacheritem .peopleimg {
+				width: 60px;
+				height: 60px;
+				border-radius: 30px;
+			}
+
+			.teacheritem .teacherName {
+				font-size: 14px;
+				font-weight: bold;
+				color: #394145;
+				display: flex;
+				align-items: center;
+			}
+
+			.teacheritem .introduce {
+				font-size: 14px;
+				font-weight: 500;
+				color: #394145;
+				margin-top: 14px;
+			}
+
+			.teacheritem .follow {
+				width: 80px;
+				height: 30px;
+				background: #387df7;
+				border-radius: 4px;
+				margin-top: 28px;
+				position: absolute;
+				right: -25px;
+				font-size: 14px;
+				font-weight: 500;
+				color: #ffffff;
+				line-height: 24px;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				cursor: pointer;
+			}
+		}
+	}
 }
 </style>
diff --git a/src/views/liveBroadcast/LiveBroadcast.vue b/src/views/liveBroadcast/LiveBroadcast.vue
index 4f65b07..89085a6 100644
--- a/src/views/liveBroadcast/LiveBroadcast.vue
+++ b/src/views/liveBroadcast/LiveBroadcast.vue
@@ -1,48 +1,41 @@
 <template>
-  <div class="moreactive" style="padding: 30px">
-    <!-- 面包屑导航 -->
-    <div class="crumb">
-      <div>{{ pName }}</div>
-      <div style="margin-left: 6px; margin-right: 6px">/</div>
-      <div>{{ sName }}</div>
-      <div style="margin-left: 6px; margin-right: 6px">/</div>
-      <div style="font-weight: 700; font-size: 16px">直播详情</div>
-      <!--
+	<div class="moreactive" style="padding: 30px">
+		<!-- 面包屑导航 -->
+		<div class="crumb">
+			<div>{{ pName }}</div>
+			<div style="margin-left: 6px; margin-right: 6px">/</div>
+			<div>{{ sName }}</div>
+			<div style="margin-left: 6px; margin-right: 6px">/</div>
+			<div style="font-weight: 700; font-size: 16px">直播详情</div>
+			<!--
       <div class="preNext">
          2022-12-15注释 李晓鸽  后面打开 -->
-      <!-- <button class="btn btn01"></button>
+			<!-- <button class="btn btn01"></button>
         <span class="content" style="margin-left: 6px">上一个</span>
         <span class="content" style="margin-left: 31px">下一个</span>
         <button class="btn btn02" style="margin-left: 6px"></button> 
       </div>-->
-      <div class="return">
-        <div style="display: flex" @click="returnclick">
-          <img
-            class="img2"
-            style="margin-right: 22px"
-            src="../../assets/image/return.png"
-          />
-          <div class="text">返回</div>
-        </div>
-      </div>
-    </div>
-    <!-- 面包屑导航 -->
+			<div class="return">
+				<div style="display: flex" @click="returnclick">
+					<img class="img2" style="margin-right: 22px" src="../../assets/image/return.png" />
+					<div class="text">返回</div>
+				</div>
+			</div>
+		</div>
+		<!-- 面包屑导航 -->
 
-    <!-- 基本信息 -->
-    <div class="bascinfo">
-      <div style="margin-left: 46px">
-        <div class="title">【直播】{{ data?.liveName }}</div>
-        <div class="time" style="margin-top: 26px">
-          <img
-            style="width: 15px; height: 17px"
-            src="../../assets/image/time.png"
-          />
-          <div style="margin-left: 8px">
-            {{ data?.liveStartTime + "至" + data?.liveEndTime }}
-          </div>
-        </div>
-        <!--          todo #直播详情 没有位置字段-->
-        <!-- <div class="time" style="margin-top: 23px">
+		<!-- 基本信息 -->
+		<div class="bascinfo">
+			<div style="margin-left: 46px">
+				<div class="title">【直播】{{ data?.liveName }}</div>
+				<div class="time" style="margin-top: 26px">
+					<img style="width: 15px; height: 17px" src="../../assets/image/time.png" />
+					<div style="margin-left: 8px">
+						{{ data?.liveStartTime + "至" + data?.liveEndTime }}
+					</div>
+				</div>
+				<!--          todo #直播详情 没有位置字段-->
+				<!-- <div class="time" style="margin-top: 23px">
           <img
               style="width: 16px; height: 18px"
               src="../../assets/image/position.png"
@@ -50,124 +43,98 @@
          
           <div style="margin-left: 8px">{{ data?.activityAddress }}</div>
         </div> -->
-      </div>
-      <div class="threeBtn">
-        <botton
-          class="btn"
-          style="background: rgb(59, 191, 252)"
-          @click="showClick"
-          >观看
-        </botton>
-        <botton
-          class="btn"
-          :style="{
-            background: `${data.signFlag ? '#999' : 'rgb(57, 146, 249)'}`,
-          }"
-          @click="signClick"
-          >{{ data.signFlag ? "已签到" : "签到" }}
-        </botton>
-        <botton
-          style="background: #999"
-          class="btn"
-          @click="commitClick"
-          v-if="data.isEvaluate == 0"
-        >
-          评估
-        </botton>
+			</div>
+			<div class="threeBtn">
+				<botton class="btn" :style="{
+					background: `${new Date(data.liveStartTime).getTime() > new Date().getTime() ? '#999' : 'rgb(59, 191, 252)'}`,
+				}" @click="showClick">观看
+				</botton>
+				<botton class="btn" :style="{
+					background: `${new Date(data.liveStartTime).getTime() > new Date().getTime() ? '#999' : data.signFlag ? '#999' : 'rgb(57, 146, 249)'}`,
+				}" @click="signClick">{{ data.signFlag ? "已签到" : "签到" }}
+				</botton>
+				<botton style="background: #999" class="btn" @click="commitClick" v-if="data.isEvaluate == 0">
+					评估
+				</botton>
 
-        <botton
-          :style="{
-            background: `${data.isSurvery ? '#999' : 'rgb(57, 146, 249)'}`,
-          }"
-          class="btn"
-          @click="commitClick"
-          v-if="data.isEvaluate && data.isEvaluate == 1"
-          >{{ data.isSurvery ? "已评估" : "评估" }}
-        </botton>
-      </div>
-    </div>
-    <!-- 基本信息 -->
+				<botton :style="{
+					background: `${new Date(data.liveStartTime).getTime() > new Date().getTime() ? '#999' : data.isSurvery ? '#999' : 'rgb(57, 146, 249)'}`,
+				}" class="btn" @click="commitClick" v-if="data.isEvaluate && data.isEvaluate == 1">{{ data.isSurvery ? "已评估"
+		: "评估"
+}}
+				</botton>
+			</div>
+		</div>
+		<!-- 基本信息 -->
 
-    <!-- 详细信息 -->
-    <div class="detailinfo">
-      <div class="detail">
-        <div class="detailT">
-          <div class="" style="margin-left: 48px; margin-right: 48px">
-            <div class="title">
-              <img
-                style="width: 20px; height: 20px"
-                src="../../assets/image/course.png"
-              />
-              <div class="text">直播说明</div>
-              <div class="box"></div>
-            </div>
-            <div style="display: flex; align-items: center">
-              <!--              todo #直播 没有课前预习字段-->
-              <div class="content">
-                {{ data.liveExplain }}
-              </div>
-            </div>
+		<!-- 详细信息 -->
+		<div class="detailinfo">
+			<div class="detail">
+				<div class="detailT">
+					<div class="" style="margin-left: 48px; margin-right: 48px">
+						<div class="title">
+							<img style="width: 20px; height: 20px" src="../../assets/image/course.png" />
+							<div class="text">直播说明</div>
+							<div class="box"></div>
+						</div>
+						<div style="display: flex; align-items: center">
+							<!--              todo #直播 没有课前预习字段-->
+							<div class="content">
+								{{ data.liveExplain }}
+							</div>
+						</div>
 
-            <!--            <div class="title">-->
-            <!--              <img-->
-            <!--                  style="width: 20px; height: 20px"-->
-            <!--                  src="../../assets/image/write.png"-->
-            <!--              />-->
-            <!--              &lt;!&ndash;              todo #直播 课后作业&ndash;&gt;-->
-            <!--              <div class="text">课后作业</div>-->
-            <!--              <div class="box"></div>-->
-            <!--            </div>-->
-            <!--            <div style="display: flex; align-items: center">-->
-            <!--              <div class="content">-->
-            <!--                <span style="font-weight: 600"-->
-            <!--                >网易有道词典现有功能结构拆解+问题分析</span-->
-            <!--                ><br/>-->
-            <!--                查找资料，介绍一种国外（日本、美国、欧洲）道路（公路、铁路、城市道路、地铁）设计规范的演变过程，可以一种或几种主要技术指标为例，并说明其原因。<br/>-->
-            <!--              </div>-->
-            <!--            </div>-->
-          </div>
-        </div>
-      </div>
-      <div>
-        <div class="tell">
-          <div class="title">
-            <img
-              style="width: 21px; height: 23px"
-              src="../../assets/image/tv.png"
-            />
-            <div class="text">直播公告</div>
-            <div class="box"></div>
-          </div>
-          <div class="content" v-html="data?.liveNotice"></div>
-        </div>
-        <div class="teacher">
-          <div class="title">
-            <img
-              style="width: 21px; height: 23px"
-              src="../../assets/image/livelecturer.png"
-            />
-            <!--            todo #直播详情 没有直播讲师-->
-            <div class="text">直播讲师</div>
-            <div class="box"></div>
-          </div>
-          <div
-            class="teacheritem"
-            :style="{ 'border-bottom': '1px solid rgba(56, 125, 247, 0.2)' }"
-          >
-            <img class="peopleimg" :src="teacherInfo.avatar" />
-            <div style="margin-left: 17px; width: 190px">
-              <div class="teacherName" style="margin-right: 5px">
-                {{ data.userInfoBo?.userName }}
-              </div>
-              <div class="introduce">{{ data.userInfoBo?.bandDesc }}</div>
-            </div>
-            <!--            <div class="follow">+ 关注</div>-->
-          </div>
-        </div>
-      </div>
-    </div>
-    <!-- 详细信息 -->
-  </div>
+						<!--            <div class="title">-->
+						<!--              <img-->
+						<!--                  style="width: 20px; height: 20px"-->
+						<!--                  src="../../assets/image/write.png"-->
+						<!--              />-->
+						<!--              &lt;!&ndash;              todo #直播 课后作业&ndash;&gt;-->
+						<!--              <div class="text">课后作业</div>-->
+						<!--              <div class="box"></div>-->
+						<!--            </div>-->
+						<!--            <div style="display: flex; align-items: center">-->
+						<!--              <div class="content">-->
+						<!--                <span style="font-weight: 600"-->
+						<!--                >网易有道词典现有功能结构拆解+问题分析</span-->
+						<!--                ><br/>-->
+						<!--                查找资料，介绍一种国外（日本、美国、欧洲）道路（公路、铁路、城市道路、地铁）设计规范的演变过程，可以一种或几种主要技术指标为例，并说明其原因。<br/>-->
+						<!--              </div>-->
+						<!--            </div>-->
+					</div>
+				</div>
+			</div>
+			<div>
+				<div class="tell">
+					<div class="title">
+						<img style="width: 21px; height: 23px" src="../../assets/image/tv.png" />
+						<div class="text">直播公告</div>
+						<div class="box"></div>
+					</div>
+					<div class="content" v-html="data?.liveNotice"></div>
+				</div>
+				<div class="teacher">
+					<div class="title">
+						<img style="width: 21px; height: 23px" src="../../assets/image/livelecturer.png" />
+						<!--            todo #直播详情 没有直播讲师-->
+						<div class="text">直播讲师</div>
+						<div class="box"></div>
+					</div>
+					<div class="teacheritem" :style="{ 'border-bottom': '1px solid rgba(56, 125, 247, 0.2)' }">
+						<img class="peopleimg" :src="teacherInfo.avatar" />
+						<div style="margin-left: 17px; width: 190px">
+							<div class="teacherName" style="margin-right: 5px">
+								{{ data.userInfoBo?.userName }}
+							</div>
+							<div class="introduce">{{ data.userInfoBo?.bandDesc }}</div>
+						</div>
+						<!--            <div class="follow">+ 关注</div>-->
+					</div>
+				</div>
+			</div>
+		</div>
+		<!-- 详细信息 -->
+	</div>
 </template>
 
 <script setup>
@@ -181,479 +148,506 @@ import { useUserInfo } from "@/api/utils";
 import { ElMessage } from "element-plus";
 
 const {
-  query: { courseId: liveId, id: taskId, type, pName, sName },
+	query: { courseId: liveId, id: taskId, type, pName, sName },
 } = useRoute();
 const router = useRouter();
 const returnclick = () => {
-  router.back();
+	router.back();
 };
 
 const { data } = useRequest(TASK_BROADCAST_DETAIL, { liveId });
-
+console.log('直播信息', data)
 const teacherInfo = useUserInfo(
-  computed(() => data.value.userInfoBo?.userId)
+	computed(() => data.value.userInfoBo?.userId)
 );
 
 const state = reactive({
-  activeName: "first",
-  teacher: [
-    {
-      id: 1,
-      name: "王星天（显示事业）",
-      introduce:
-        "教师是学生的镜子,学生是老师的影子。教师是学生的镜子,学生是老师的影子。教师是学生的镜子,学生是老师的影子。",
-      peopleimg: img,
-    },
-  ],
+	activeName: "first",
+	teacher: [
+		{
+			id: 1,
+			name: "王星天（显示事业）",
+			introduce:
+				"教师是学生的镜子,学生是老师的影子。教师是学生的镜子,学生是老师的影子。教师是学生的镜子,学生是老师的影子。",
+			peopleimg: img,
+		},
+	],
 });
 const { activeName, teacher } = toRefs(state);
 const signClick = () => {
-  if (data.value.signFlag) {
-    return;
-  }
-  data.value.signFlag = 1;
-  ElMessage.info("签到成功");
-  request(TASK_BROADCAST_SIGN, { courseId: liveId, taskId, type });
+	if (data.value.liveStartTime) {
+		let date1 = new Date(data.value.liveStartTime).getTime()
+		let date2 = new Date().getTime()
+		if (date1 > date2) {
+			ElMessage.info("未到开始时间，请耐心等待！");
+			return;
+		}
+	}
+	if (data.value.signFlag) {
+		return;
+	}
+	data.value.signFlag = 1;
+	ElMessage.info("签到成功");
+	request(TASK_BROADCAST_SIGN, { courseId: liveId, taskId, type });
 };
 const commitClick = () => {
-  if (data.value.isSurvery) {
-    return;
-  }
-  if (data.value.isEvaluate == 0) {
-    ElMessage.info("此直播无评估");
-    return;
-  }
+	if (data.value.liveStartTime) {
+		let date1 = new Date(data.value.liveStartTime).getTime()
+		let date2 = new Date().getTime()
+		if (date1 > date2) {
+			ElMessage.info("未到开始时间，请耐心等待！");
+			return;
+		}
+	}
+	if (data.value.isSurvery) {
+		// return;
+	}
+	if (data.value.isEvaluate == 0) {
+		ElMessage.info("此直播无评估");
+		return;
+	}
 
-  router.push({
-    path: "/surveydetail",
-    query: {
-      courseId: data.value.assessmentId,
-      pName: "直播",
-      sName: data.value.liveName,
-    },
-  });
+	router.push({
+		path: "/surveydetail",
+		query: {
+			courseId: data.value.assessmentId,
+			pName: "直播",
+			sName: data.value.liveName,
+		},
+	});
 };
 
 function showClick() {
-  window.open(data.value.liveLink);
+	if (data.value.liveStartTime) {
+		let date1 = new Date(data.value.liveStartTime).getTime()
+		let date2 = new Date().getTime()
+		if (date1 > date2) {
+			ElMessage.info("未到开始时间，请耐心等待！");
+			return;
+		}
+	}
+	window.open(data.value.liveLink);
 }
 </script>
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped lang="scss">
 .moreactive {
-  .crumb {
-    color: #fff;
-    display: flex;
-    font-size: 14px;
-    line-height: 24px;
-    position: relative;
-  }
-  .return {
-    position: absolute;
-    right: 10%;
-    .text {
-      text-align: center;
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-    }
-  }
-  .preNext {
-    position: absolute;
-    right: 0px;
+	.crumb {
+		color: #fff;
+		display: flex;
+		font-size: 14px;
+		line-height: 24px;
+		position: relative;
+	}
 
-    .content {
-      font-size: 14px;
-      color: #fff;
-      width: 43px;
-      height: 14px;
-      display: inline-block;
-      position: relative;
-      top: -6px;
-      cursor: pointer;
-    }
+	.return {
+		position: absolute;
+		right: 10%;
 
-    .btn {
-      width: 23px;
-      height: 23px;
-      border-radius: 50%;
-      border: 0;
-      cursor: pointer;
-    }
+		.text {
+			text-align: center;
+			display: flex;
+			flex-direction: row;
+			align-items: center;
+		}
+	}
 
-    .btn01 {
-      background-image: url("../../assets/image/prev.png");
-    }
+	.preNext {
+		position: absolute;
+		right: 0px;
 
-    .btn02 {
-      background-image: url("../../assets/image/next.png");
-    }
-  }
+		.content {
+			font-size: 14px;
+			color: #fff;
+			width: 43px;
+			height: 14px;
+			display: inline-block;
+			position: relative;
+			top: -6px;
+			cursor: pointer;
+		}
 
-  .bascinfo {
-    width: 100%;
-    height: 180px;
-    border-radius: 8px;
-    background-color: rgba(255, 255, 255, 1);
-    margin-top: 37px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
+		.btn {
+			width: 23px;
+			height: 23px;
+			border-radius: 50%;
+			border: 0;
+			cursor: pointer;
+		}
 
-    .threeBtn {
-      display: flex;
-      width: 490px;
-      margin-right: 87px;
+		.btn01 {
+			background-image: url("../../assets/image/prev.png");
+		}
 
-      .btn {
-        width: 146px;
-        height: 46px;
-        background: #2478ff;
-        border-radius: 4px;
-        box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        color: #fff;
-        font-size: 14px;
-        font-weight: 800;
-        line-height: 24px;
-        cursor: pointer;
-        margin-left: 20px;
-      }
-    }
+		.btn02 {
+			background-image: url("../../assets/image/next.png");
+		}
+	}
 
-    .title {
-      font-size: 20px;
-      font-weight: 800;
-      color: #333333;
-      line-height: 24px;
-      margin-left: -9px;
-    }
+	.bascinfo {
+		width: 100%;
+		height: 180px;
+		border-radius: 8px;
+		background-color: rgba(255, 255, 255, 1);
+		margin-top: 37px;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
 
-    @media screen and (max-width: 1030px) {
-      // .threeBtn {
-      //   margin-right: 30px;
-      // }
-      .title {
-        margin-bottom: -24px;
-      }
-    }
-    // @media screen and(max-width:) {
-    // }
-    .time {
-      font-size: 14px;
-      color: #6e7b84;
-      line-height: 24px;
-      display: flex;
-      align-items: center;
-    }
-  }
+		.threeBtn {
+			display: flex;
+			width: 490px;
+			margin-right: 87px;
 
-  .detailinfo {
-    width: 100%;
-    margin-top: 20px;
-    display: flex;
+			.btn {
+				width: 146px;
+				height: 46px;
+				background: #2478ff;
+				border-radius: 4px;
+				box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				color: #fff;
+				font-size: 14px;
+				font-weight: 800;
+				line-height: 24px;
+				cursor: pointer;
+				margin-left: 20px;
+			}
+		}
 
-    .detail {
-      flex: 1;
-      margin-right: 20px;
+		.title {
+			font-size: 20px;
+			font-weight: 800;
+			color: #333333;
+			line-height: 24px;
+			margin-left: -9px;
+		}
 
-      .detailT {
-        min-height: 646px;
-        background: #ffffff;
-        border-radius: 8px;
-        color: rgba(51, 51, 51, 1);
+		@media screen and (max-width: 1030px) {
 
-        .title {
-          display: flex;
-          align-items: center;
-          padding-top: 39px;
-          position: relative;
-        }
+			// .threeBtn {
+			//   margin-right: 30px;
+			// }
+			.title {
+				margin-bottom: -24px;
+			}
+		}
 
-        .title .text {
-          margin-left: 8px;
-          font-size: 16px;
-          color: rgba(51, 51, 51, 1);
-          font-weight: 800;
-        }
+		// @media screen and(max-width:) {
+		// }
+		.time {
+			font-size: 14px;
+			color: #6e7b84;
+			line-height: 24px;
+			display: flex;
+			align-items: center;
+		}
+	}
 
-        .title .box {
-          width: 75px;
-          height: 10px;
-          background-color: rgba(36, 120, 255, 0.15);
-          position: absolute;
-          left: 23px;
-          top: 53px;
-        }
+	.detailinfo {
+		width: 100%;
+		margin-top: 20px;
+		display: flex;
 
-        .content {
-          margin-left: 8px;
-          font-size: 14px;
-          color: rgba(51, 51, 48, 1);
-          font-weight: 500;
-          line-height: 35px;
-          margin-top: 30px;
-        }
-      }
+		.detail {
+			flex: 1;
+			margin-right: 20px;
 
-      .detailB {
-        min-height: 363px;
-        background: #ffffff;
-        border-radius: 8px;
-        margin-top: 20px;
+			.detailT {
+				min-height: 646px;
+				background: #ffffff;
+				border-radius: 8px;
+				color: rgba(51, 51, 51, 1);
 
-        .el-tabs__item {
-          height: 69px;
-          padding: 25px 7px 0px 52px;
-          font-size: 14px;
-          font-weight: 500;
-        }
+				.title {
+					display: flex;
+					align-items: center;
+					padding-top: 39px;
+					position: relative;
+				}
 
-        .el-tabs__nav-wrap::after {
-          background-color: rgba(56, 125, 247, 0.2);
-        }
+				.title .text {
+					margin-left: 8px;
+					font-size: 16px;
+					color: rgba(51, 51, 51, 1);
+					font-weight: 800;
+				}
 
-        .enclosure {
-          height: 89px;
-          margin-left: 51px;
-          margin-right: 40px;
-          // border-bottom: 1px solid rgba(56, 125, 247, 0.2);
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
+				.title .box {
+					width: 75px;
+					height: 10px;
+					background-color: rgba(36, 120, 255, 0.15);
+					position: absolute;
+					left: 23px;
+					top: 53px;
+				}
 
-          .enclosureL {
-            display: flex;
-            align-items: center;
-            font-size: 14px;
-            font-weight: 400;
-            color: #677d86;
-            line-height: 24px;
-          }
+				.content {
+					margin-left: 8px;
+					font-size: 14px;
+					color: rgba(51, 51, 48, 1);
+					font-weight: 500;
+					line-height: 35px;
+					margin-top: 30px;
+				}
+			}
 
-          .download {
-            display: flex;
-            align-items: center;
-            font-size: 16px;
-            font-weight: 400;
-            color: #2478ff;
-            line-height: 24px;
-            cursor: pointer;
-          }
-        }
+			.detailB {
+				min-height: 363px;
+				background: #ffffff;
+				border-radius: 8px;
+				margin-top: 20px;
 
-        .work {
-          margin-left: 51px;
-          margin-right: 40px;
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          margin-top: 37px;
-        }
+				.el-tabs__item {
+					height: 69px;
+					padding: 25px 7px 0px 52px;
+					font-size: 14px;
+					font-weight: 500;
+				}
 
-        .work .question {
-          font-size: 14px;
-          font-weight: 500;
-          color: #333330;
-          line-height: 18px;
-        }
+				.el-tabs__nav-wrap::after {
+					background-color: rgba(56, 125, 247, 0.2);
+				}
 
-        .work .active {
-          width: 82px;
-          height: 28px;
-          background: linear-gradient(90deg, #a5d4e0 0%, #b4dce6 100%);
-          border-radius: 4px;
-          font-size: 14px;
-          font-weight: 500;
-          color: #ffffff;
-          line-height: 24px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          cursor: pointer;
-          margin-right: 11px;
-        }
+				.enclosure {
+					height: 89px;
+					margin-left: 51px;
+					margin-right: 40px;
+					// border-bottom: 1px solid rgba(56, 125, 247, 0.2);
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
 
-        .work .unactive {
-          width: 80px;
-          height: 26px;
-          border: 1px solid #a5d4e0;
-          border-radius: 4px;
-          font-size: 14px;
-          font-weight: 500;
-          color: #a5d4e0;
-          line-height: 24px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          margin-right: 11px;
-          cursor: pointer;
-        }
+					.enclosureL {
+						display: flex;
+						align-items: center;
+						font-size: 14px;
+						font-weight: 400;
+						color: #677d86;
+						line-height: 24px;
+					}
 
-        .work .btncolor {
-          background: linear-gradient(90deg, #84aad2 0%, #a4c5e9 100%);
-        }
+					.download {
+						display: flex;
+						align-items: center;
+						font-size: 16px;
+						font-weight: 400;
+						color: #2478ff;
+						line-height: 24px;
+						cursor: pointer;
+					}
+				}
 
-        .work .bordercolor {
-          border: 1px solid #85aad2;
-        }
+				.work {
+					margin-left: 51px;
+					margin-right: 40px;
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					margin-top: 37px;
+				}
 
-        .work .fontcolor {
-          color: rgba(133, 170, 210, 1);
-        }
+				.work .question {
+					font-size: 14px;
+					font-weight: 500;
+					color: #333330;
+					line-height: 18px;
+				}
 
-        .work .submit {
-          width: 126px;
-          height: 46px;
-          background: #2478ff;
-          box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
-          border-radius: 4px;
-          font-size: 16px;
-          font-weight: 800;
-          color: #ffffff;
-          line-height: 24px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          cursor: pointer;
-        }
-      }
-    }
+				.work .active {
+					width: 82px;
+					height: 28px;
+					background: linear-gradient(90deg, #a5d4e0 0%, #b4dce6 100%);
+					border-radius: 4px;
+					font-size: 14px;
+					font-weight: 500;
+					color: #ffffff;
+					line-height: 24px;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					cursor: pointer;
+					margin-right: 11px;
+				}
 
-    .tell {
-      width: 434px;
-      // height: 10%;
+				.work .unactive {
+					width: 80px;
+					height: 26px;
+					border: 1px solid #a5d4e0;
+					border-radius: 4px;
+					font-size: 14px;
+					font-weight: 500;
+					color: #a5d4e0;
+					line-height: 24px;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					margin-right: 11px;
+					cursor: pointer;
+				}
 
-      // min-height: 557px;
-      background-color: rgba(255, 255, 255, 1);
-      border-radius: 8px;
-      background: linear-gradient(
-        180deg,
-        rgba(36, 120, 255, 0.15) 0%,
-        rgba(255, 255, 255) 50%
-      );
+				.work .btncolor {
+					background: linear-gradient(90deg, #84aad2 0%, #a4c5e9 100%);
+				}
 
-      .title {
-        display: flex;
-        align-items: center;
-        padding-top: 39px;
-        position: relative;
-        margin-left: 48px;
-      }
+				.work .bordercolor {
+					border: 1px solid #85aad2;
+				}
 
-      .title .text {
-        margin-left: 8px;
-        font-size: 16px;
-        color: rgba(51, 51, 51, 1);
-        font-weight: 800;
-      }
+				.work .fontcolor {
+					color: rgba(133, 170, 210, 1);
+				}
 
-      .title .box {
-        width: 75px;
-        height: 10px;
-        background-color: rgba(36, 120, 255, 0.15);
-        position: absolute;
-        left: 23px;
-        top: 53px;
-      }
+				.work .submit {
+					width: 126px;
+					height: 46px;
+					background: #2478ff;
+					box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
+					border-radius: 4px;
+					font-size: 16px;
+					font-weight: 800;
+					color: #ffffff;
+					line-height: 24px;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					cursor: pointer;
+				}
+			}
+		}
 
-      .content {
-        margin: 25px 24px 0px 49px;
-        padding-bottom: 55px;
-        color: #677d86;
-        width: 361px;
-        // height: 304px;
-        line-height: 24px;
-        font-size: 16px;
-        font-weight: bold;
-      }
-    }
-  }
+		.tell {
+			width: 434px;
+			// height: 10%;
 
-  .teacher {
-    margin-top: 22px;
-    width: 434px;
-    // height: 328px;
-    background-color: rgba(255, 255, 255, 1);
-    border-radius: 8px;
-    padding-bottom: 40px;
+			// min-height: 557px;
+			background-color: rgba(255, 255, 255, 1);
+			border-radius: 8px;
+			background: linear-gradient(180deg,
+					rgba(36, 120, 255, 0.15) 0%,
+					rgba(255, 255, 255) 50%);
 
-    .title {
-      display: flex;
-      align-items: center;
-      padding-top: 39px;
-      position: relative;
-      margin-left: 48px;
-    }
+			.title {
+				display: flex;
+				align-items: center;
+				padding-top: 39px;
+				position: relative;
+				margin-left: 48px;
+			}
 
-    .title .text {
-      margin-left: 8px;
-      font-size: 16px;
-      color: rgba(51, 51, 51, 1);
-      font-weight: 800;
-    }
+			.title .text {
+				margin-left: 8px;
+				font-size: 16px;
+				color: rgba(51, 51, 51, 1);
+				font-weight: 800;
+			}
 
-    .title .box {
-      width: 75px;
-      height: 10px;
-      background-color: rgba(36, 120, 255, 0.15);
-      position: absolute;
-      left: 23px;
-      top: 53px;
-    }
+			.title .box {
+				width: 75px;
+				height: 10px;
+				background-color: rgba(36, 120, 255, 0.15);
+				position: absolute;
+				left: 23px;
+				top: 53px;
+			}
 
-    .teacheritem {
-      margin-left: 48px;
-      margin-right: 48px;
-      // min-height: 115px;
-      padding: 25px 0px;
-      display: flex;
-      // align-items: center;
-      position: relative;
-    }
+			.content {
+				margin: 25px 24px 0px 49px;
+				padding-bottom: 55px;
+				color: #677d86;
+				width: 361px;
+				// height: 304px;
+				line-height: 24px;
+				font-size: 16px;
+				font-weight: bold;
+			}
+		}
+	}
 
-    .teacheritem .peopleimg {
-      width: 60px;
-      height: 60px;
-      border-radius: 30px;
-      margin-top: 2px;
-    }
+	.teacher {
+		margin-top: 22px;
+		width: 434px;
+		// height: 328px;
+		background-color: rgba(255, 255, 255, 1);
+		border-radius: 8px;
+		padding-bottom: 40px;
 
-    .teacheritem .teacherName {
-      font-size: 14px;
-      font-weight: bold;
-      color: #394145;
-      display: flex;
-      align-items: center;
-    }
+		.title {
+			display: flex;
+			align-items: center;
+			padding-top: 39px;
+			position: relative;
+			margin-left: 48px;
+		}
 
-    .teacheritem .introduce {
-      font-size: 14px;
-      font-weight: 500;
-      color: #394145;
-      margin-top: 14px;
-    }
+		.title .text {
+			margin-left: 8px;
+			font-size: 16px;
+			color: rgba(51, 51, 51, 1);
+			font-weight: 800;
+		}
 
-    .teacheritem .follow {
-      width: 80px;
-      height: 30px;
-      background: #387df7;
-      border-radius: 4px;
-      margin-top: 28px;
-      position: absolute;
-      right: -25px;
-      font-size: 14px;
-      font-weight: 500;
-      color: #ffffff;
-      line-height: 24px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      cursor: pointer;
-    }
-  }
+		.title .box {
+			width: 75px;
+			height: 10px;
+			background-color: rgba(36, 120, 255, 0.15);
+			position: absolute;
+			left: 23px;
+			top: 53px;
+		}
+
+		.teacheritem {
+			margin-left: 48px;
+			margin-right: 48px;
+			// min-height: 115px;
+			padding: 25px 0px;
+			display: flex;
+			// align-items: center;
+			position: relative;
+		}
+
+		.teacheritem .peopleimg {
+			width: 60px;
+			height: 60px;
+			border-radius: 30px;
+			margin-top: 2px;
+		}
+
+		.teacheritem .teacherName {
+			font-size: 14px;
+			font-weight: bold;
+			color: #394145;
+			display: flex;
+			align-items: center;
+		}
+
+		.teacheritem .introduce {
+			font-size: 14px;
+			font-weight: 500;
+			color: #394145;
+			margin-top: 14px;
+		}
+
+		.teacheritem .follow {
+			width: 80px;
+			height: 30px;
+			background: #387df7;
+			border-radius: 4px;
+			margin-top: 28px;
+			position: absolute;
+			right: -25px;
+			font-size: 14px;
+			font-weight: 500;
+			color: #ffffff;
+			line-height: 24px;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			cursor: pointer;
+		}
+	}
 }
 </style>