修改BUG

src/styles/vant.scss

@@ -70,7 +70,8 @@
     }
   }
   .van-tabs__line {
-    background-color: #0088e9;
-    width: 35% !important; 
+    // background-color: #0088e9;
+    // width: 35% !important; 
+    display: none;
   }
 }

src/views/home/exam/page-exam-item-doing.vue

@@ -338,7 +338,6 @@ export default {
           return;
         }
         this.startTimeSeconds = this.startTimeSeconds + 1000; // 新增开始进行了考试的时长
-        console.log(this.startTimeSeconds);
         if (
           this.examBeforeHalfEndTimeSeconds / 2 > diffTime &&
           !this.isOverHalfTime

src/views/home/exam/page-exam.vue

@@ -8,6 +8,20 @@
         @click="handleClickExamItemFun(item)"
       >
         <div class="exam-item-name">{{ item.name }}</div>
+        <div
+          :class="{
+            'exam-item-states': true,
+            'exam-item-states-yellow':
+              item.examStatus === examStatesType.NOT_START,
+            'exam-item-states-green':
+              item.examStatus === examStatesType.STARTED,
+            'exam-item-states-red':
+              item.examStatus === examStatesType.STARTEXAMING,
+            'exam-item-states-gray': item.examStatus === examStatesType.OVER
+          }"
+        >
+          {{ item.examStatusTxt }}
+        </div>
         <div class="exam-item-describe">考试时间：{{ item.startTime }}</div>
         <div class="exam-item-describe">
           考试时长：{{ item.examTimeMinsTxt }}
@@ -21,11 +35,18 @@
 </template>
 
 <script>
+import { Toast } from "vant";
 export default {
   name: "page-exam",
   components: {},
   data() {
     return {
+      examStatesType: {
+        NOT_START: 0, // 未开始
+        STARTED: 1, // 已开始
+        STARTEXAMING: 2, // 考试中
+        OVER: 3 // 已结束
+      },
       examList: []
     };
   },
@@ -45,8 +66,15 @@ export default {
               let formateTimeDiff = this.formateTimeDiffFun(item.duration);
               item.examTimeMins = formateTimeDiff.examTimeMins;
               item.examTimeMinsTxt = formateTimeDiff.examTimeMinsTxt;
+              let obj = this.formateExamStatesFun(
+                item.startTime,
+                item.deadline
+              );
+              item.examStatus = obj.status;
+              item.examStatusTxt = obj.statusTxt;
             });
             this.examList = res.data;
+            console.log(this.examList);
           }
           this.$store.commit("toggleLoading", false);
         })
@@ -75,8 +103,40 @@ export default {
         examTimeMinsTxt: timeDiffTxt
       };
     },
+    // 过滤考试状态
+    formateExamStatesFun(startTime, endTime) {
+      let curTime = Date.now();
+      let startTimesCeconds = new Date(startTime).getTime();
+      let endTimeCeconds = new Date(endTime).getTime();
+      if (curTime >= startTimesCeconds) {
+        if (endTimeCeconds >= curTime) {
+          return {
+            status: this.examStatesType.OVER,
+            statusTxt: "已结束"
+          };
+        } else {
+          return {
+            status: this.examStatesType.STARTED,
+            statusTxt: "已开始"
+          };
+        }
+      } else {
+        return {
+          status: this.examStatesType.NOT_START,
+          statusTxt: "未开始"
+        };
+      }
+    },
     // 操作：点击了某个考试
     handleClickExamItemFun(item) {
+      if (item.examStatus === this.examStatesType.NOT_START) {
+        Toast("考试未开始");
+        return;
+      }
+      if (item.examStatus === this.examStatesType.OVER) {
+        Toast("考试已结束");
+        return;
+      }
       this.$store.commit("updateExamItemStore", {
         field: "examItem",
         value: item
@@ -103,6 +163,7 @@ export default {
       background-color: #fff;
       border-radius: 4px;
       box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
+      position: relative;
       .exam-item-name {
         height: 2rem;
         border-bottom: 1px solid #e4e8eb;
@@ -112,6 +173,27 @@ export default {
         font-weight: bold;
         color: #000;
       }
+      .exam-item-states {
+        height: 2rem;
+        line-height: 2rem;
+        position: absolute;
+        right: 0.5rem;
+        top: 0;
+        font-size: 0.6rem;
+        border-radius: 0.2rem;
+      }
+      .exam-item-states-yellow {
+        color: #e6a23c;
+      }
+      .exam-item-states-green {
+        color: #67c23a;
+      }
+      .exam-item-states-red {
+        color: #f56c6c;
+      }
+      .exam-item-states-gray {
+        color: #909399;
+      }
       .exam-item-describe {
         margin-top: 0.5rem;
         span {

src/views/home/index.vue

@@ -113,9 +113,9 @@ export default {
         }
       });
       this.engineeringWorkList = [
-        { text: "桥隧工", value: 0 },
-        { text: "桥梁工", value: 1 },
-        { text: "线路工", value: 2 }
+        { text: "桥隧工", value: 1 },
+        { text: "桥梁工", value: 2 },
+        { text: "线路工", value: 3 }
       ];
       this.activeTabName = 0;
       this.onChangeTabFun(this.activeTabName);