修改阶段状态

src/views/project/ProjectDetails.vue

@@ -21,8 +21,8 @@
             <div class="titleR" :style="{ display: 'flex' }">
               <img src="../../assets/image/pathdetails/circle.png"/>
               <div class="titleRT"
-                   :style="(i.stageStatusName === '未开始' || i.stageStatusName === '已结束') && 'color:#999'">
-                {{ i.stageStatusName }}
+                   :style="(i.statusName === '已完成' || i.statusName === '进行中') ? 'color:#0060ff' : 'color:#999'">
+                {{ i.statusName || (data.unlockMode === 1 ? '未开始' : '未解锁') }}
               </div>
             </div>
             <!-- <div class="titleR" :style="{ display: i.status === 2 ? 'flex' : 'none' }">
@@ -90,14 +90,9 @@
                 </div>
               </div>
             </div>
-            <div class="goclass" @click="toFinish(value, i.stageName, i.stageId)">
-              {{
-                value.status === 1
-                    ? "已完成"
-                    : types.path[value.type]
-                        ? types.toName[value.type]
-                        : "未开放"
-              }}
+            <div class="goclass" @click="toFinish(value, i.stageName, i.stageId)"
+                 :style="{background:(value.statusName !=='已结束' && (value.statusName || data.unlockMode === 1)) ?'#2478ff':'#999'}">
+              {{ value.statusName || (data.unlockMode === 1 ? types.toName[value.type] : '未解锁') }}
             </div>
             <!--            <div :style="{ display: value.status === 1 ? 'block' : 'none' }">-->
             <!--              <div-->
@@ -440,8 +435,39 @@ const router = useRouter();
 const {data} = useRequest(PROJECT_PROCESS, {
   projectId: projectId || courseId,
 });
+
+
 watch(() => data.value.stageProcessList, () => {
-  data.value.stageProcessList.forEach((t)=>{t.stageStatusName = getTaskStatus(t)})
+  // data.value.unlockMode 1自由模式 2闯关模式 3 闯关模式 必修 flag true
+  if (data.value.status === -1) {
+    data.value.stageProcessList.forEach((t) => {
+      t.statusName = '已结束';
+      t.taskProcessList?.forEach((s) => s.statusName = '已结束')
+    })
+    return
+  }
+  if (data.value.unlockMode === 1) {
+    data.value.stageProcessList.forEach((t) => {
+      t.statusName = '进行中'
+      const stageState = t.taskProcessList?.every((s) => {
+        s.statusName = s.status === 1 ? '已完成' : types.value.toName[s.type]
+        return s.status === 1
+      })
+      stageState && (t.statusName = '已完成')
+    })
+    return
+  }
+  data.value.stageProcessList.some((t) => {
+    t.statusName = '已完成'
+    const stageState = t.taskProcessList?.some((s) => {
+      s.unlock = true
+      s.statusName = '已完成'
+      s.status !== 1 && (s.statusName = types.value.toName[s.type])
+      return data.value.unlockMode === 2 ? s.status !== 1 : (s.status !== 1 && s.flag)
+    })
+    stageState && (t.statusName = '进行中');
+    return stageState
+  })
 }, {deep: true})
 
 
@@ -524,23 +550,6 @@ request(PointList, {projectId: projectId}).then(res => {
   console.log(err)
 });
 
-
-function getTaskStatus(d){
-  if (data.value.status !== 3) {
-    return '已结束'
-  }
-  if (dayjs().isBefore(dayjs(d.beginTime)) || !d.taskProcessList?.filter(t => t.status === 1)?.length) {
-    return '未开始'
-  }
-  if (dayjs().isAfter(dayjs(data.value.endTime))) {
-    return '已结束'
-  }
-  if (d.taskProcessList?.filter(t => t.status === 1)?.length === d.taskProcessList?.length) {
-    return '已完成'
-  }
-  return '进行中'
-}
-
 const loading = ref(false);
 loading.value = ElLoading.service({
   lock: true,
@@ -630,7 +639,6 @@ const dialogVisibleTip = ref('该任务无法学习，请联系管理员进行
 // 判断当前任务已结束及时间意义上的结束 提示用户
 function judgeTaskIsEnd(type, endTimes, status) {
   // type 任务类型 endTime 结束时间 status 任务状态 (状态  0 未完成 1 已完成 2 未开始 -1 已结束)
-  console.log(type, endTimes, status);
   let isEnd = false;
   let nowTime = new Date().getTime();
   let endTime = new Date().getTime(endTimes);
@@ -656,7 +664,10 @@ function judgeTaskIsEnd(type, endTimes, status) {
 }
 
 async function toFinish(d, sName, chapterOrStageId) {
-  console.log("dddddd", d, sName, chapterOrStageId);
+  if (data.value.unlockMode !==1 && !d.statusName) {
+    ElMessage.warning("当前未解锁")
+    return
+  }
   if (judgeTaskIsEnd(d.type, data.value.endTime, data.value.status)) {
     ElMessage.error("当前任务已结束")
     return

src/views/roadmap/PathDetails.vue

@@ -6,7 +6,8 @@
 
     <div class="pdname">
       {{ data.name }}
-			<el-popover v-if="data.chapterRemark" ref="popover" popper-class="jianjie" placement="right" trigger="hover" :width="300"
+      <el-popover v-if="data.chapterRemark" ref="popover" popper-class="jianjie" placement="right" trigger="hover"
+                  :width="300"
                   :content="data.chapterRemark">
         <template #reference><span style="font-size: 16px;font-weight: 600;">关卡说明></span></template>
       </el-popover>
@@ -20,10 +21,14 @@
             <div class="titleL">{{ data.currentStageName }}</div>
             <div class="titleR" :style="{ display: 'flex' }">
               <img :src="data.currentChapterCnt ? circle : circle2"/>
-							<div class="titleRT" :style="(stageStatusName === '未开始' || stageStatusName === '已结束') && 'color:#999'">{{stageStatusName}}</div>
+              <div class="titleRT"
+                   :style="(data.statusName === '已完成' || data.statusName === '进行中') ? 'color:#0060ff' : 'color:#999'">
+                {{ data.statusName || (data.unlockMode === 1 ? '未开始' : '未解锁') }}
               </div>
             </div>
-					<div class="course" v-for="(value, index) in data.taskBoList?.filter((e) => !whiteTypes(e.type))" :key="index">
+          </div>
+          <div class="course" v-for="(value, index) in data.taskBoList?.filter((e) => !whiteTypes(e.type))"
+               :key="index">
             <div style="width: 70%">
               <div v-if="value.name.length > 50" class="coursename" :title="value.name">
                 <el-popover ref="popover" placement="right" trigger="hover" :width="300" :content="value.name">
@@ -58,7 +63,8 @@
                 <div>当前进度</div>
                 <div class="progress">
                   <div style="width: 291px">
-										<el-progress :percentage="parseInt(value.currentRatio)" :show-text="false" :stroke-width="8" :color="
+                    <el-progress :percentage="parseInt(value.currentRatio)" :show-text="false" :stroke-width="8"
+                                 :color="
 	{
 		0: 'rgba(238, 112, 108, 1)',
 		1: 'rgba(255, 151, 38, 1)',
@@ -84,10 +90,10 @@
                 </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 class="goclass"
+                 :style="{background:(value.statusName !=='已结束' && (value.statusName || data.unlockMode === 1)) ?'#2478ff':'#999'}"
+                 @click="toFinish(value)">
+              {{ value.statusName || (data.unlockMode === 1 ? types.toName[value.type] : '未解锁') }}
             </div>
             <!--            <div :style="{ display: value.status === 1 ? 'block' : 'none' }">-->
             <!--              <div-->
@@ -128,7 +134,9 @@
 								align-items: center;
 								margin-bottom: 15px;">
                   <!-- <img :src="value.img" style="width: 22px; height: 26px"/> -->
-								<FileTypeImg :v-model="value.name? value.name : value.slice(value.lastIndexOf('/')+1,value.indexOf('-')) + value.slice(value.lastIndexOf('.'))" :style="{width: '22px',height: '26px'}"></FileTypeImg>
+                  <FileTypeImg
+                      :v-model="value.name? value.name : value.slice(value.lastIndexOf('/')+1,value.indexOf('-')) + value.slice(value.lastIndexOf('.'))"
+                      :style="{width: '22px',height: '26px'}"></FileTypeImg>
                   <div class="sharedocname">{{ value.name }}</div>
                   <div class="download">
                     <img
@@ -176,7 +184,9 @@
 
             <div class="rate">
               <div class="ratetext">上次学到：{{ data.lastLearned }}</div>
-						<div v-if="data.lastLearned" class="ratebtn" @click="continueLearn(data.lastLearned, data.taskBoList)">继续学习</div>
+              <div v-if="data.lastLearned" class="ratebtn" @click="continueLearn(data.lastLearned, data.taskBoList)">
+                继续学习
+              </div>
             </div>
             <div style="margin-top: 16px">
               <div class="progressBox">
@@ -290,18 +300,31 @@ const { data } = useRequest(ROUTER_PROCESS, { routerId });
 const userInfo = computed(() => store.state.userInfo);
 const activeName = ref("first");
 
-const stageStatusName = computed(()=>{
-  if(data.value.status !== 1){
-    return '已结束'
+watch(() => data.value.taskBoList, () => {
+  // data.value.unlockMode 1自由模式 2闯关模式 3 闯关模式 必修 flag true
+  if (data.value.status === -1) {
+    data.value.statusName = '已结束'
+    data.value.taskBoList.forEach((t) => t.statusName = '已结束')
+    return
   }
-  if(!data.value.taskBoList?.filter(t=>t.status===1)?.length){
-    return '未开始'
+  data.value.statusName = '进行中'
+  if (data.value.unlockMode === 1) {
+    data.value.taskBoList?.every((s) => {
+      s.statusName = s.status === 1 ? '已完成' : types.value.toName[s.type]
+      return s.status === 1
+    }) && (data.value.statusName = '已完成')
+    return
   }
-  if(data.value.taskBoList.filter(t=>t.status===1).length === data.value.taskBoList.length){
-    return '已完成'
-  }
-  return '进行中'
-});
+  data.value.statusName = '已完成'
+  data.value.taskBoList?.some((s) => {
+    s.unlock = true
+    s.statusName = '已完成'
+    s.status !== 1 && (s.statusName = types.value.toName[s.type])
+    return data.value.unlockMode === 2 ? s.status !== 1 : (s.status !== 1 && s.flag)
+  }) && (data.value.statusName = '进行中')
+
+}, {deep: true})
+
 const handleClick = (tab, event) => {
   console.log(tab, event);
 };
@@ -391,9 +414,10 @@ function judgeTaskIsEnd(type, endTimes, status) {
 }
 
 async function toFinish(d) {
-  console.log(d)
-  console.log(data.value.currentStageId, routerId)
-
+  if (data.value.unlockMode !==1 && !d.statusName) {
+    ElMessage.warning("当前未解锁")
+    return
+  }
   if (judgeTaskIsEnd(d.type, data.value.endTime, data.value.status)) {
     ElMessage.error("当前任务已结束")
     return