优化表格

src/pages/stuMan/StudentProgress.vue

@@ -34,8 +34,8 @@
               进度<br />({{ currentCourse.ClassHours }}课时)
             </td>
             <td v-for="(x,i) in students" :key="i" :class="{ 'stop': currentCourse.ClassHours-x.ClassProgress<0 || x.ScheduleStatus==1 }">
-              <span>剩余{{ currentCourse.ClassHours-x.ClassProgress }}课时</span>
-              <div v-if="currentCourse.ClassHours-x.ClassProgress<0 || x.ScheduleStatus==1">暂停排课</div>
+              <span>剩余{{ ((currentCourse.CourseRate==10||currentCourse.CourseRate==11)?x.TotalTimes:currentCourse.ClassHours)-x.ClassProgress }}课时</span>
+              <div v-if="((currentCourse.CourseRate==10||currentCourse.CourseRate==11)?x.TotalTimes:currentCourse.ClassHours)-x.ClassProgress<0 || x.ScheduleStatus==1">暂停排课</div>
               <div v-else class="text-primary">周一，五排课</div>
             </td>
           </tr>
@@ -54,9 +54,9 @@
           <!-- 表格内容 study-online-bg -->
           <tr v-for="(x,i) in chapters" :key="i">
             <td class="sticky-column defaultBg" style="text-align: left;">{{ x.ChapterName }}</td>
-            <td v-for="(y,yi) in x.assemble" :key="yi" :class="{'study-normal':y}">
+            <td v-for="(y,yi) in x.assemble" :key="yi" :class="{'study-normal':y,'disable-class':y&&y.overlayer}">
               &nbsp;
-              <q-tooltip :offset="[0, 0]" v-if="y">
+              <q-tooltip :offset="[0, 0]" v-if="y && !y.overlayer">
                 {{ y.Date }}
               </q-tooltip>
             </td>
@@ -167,18 +167,43 @@ export default {
       queryScheduleCourseStu({CourseRate:this.currentCourse.CourseRate}).then(r=>{
         this.students = r.Data
         this.loading = false;
+        this.setFillChapters()
         this.assembleHandler()
       }).catch(()=>{
         this.loading = false;
       })
     },
+    setFillChapters(){
+      if(this.currentCourse.CourseRate==10||this.currentCourse.CourseRate==11){
+        //TotalTimes
+        let maxTemp = 0
+        this.students.forEach(stu=>{
+          if(stu.TotalTimes && stu.TotalTimes>maxTemp) maxTemp=stu.TotalTimes
+        })
+        if(maxTemp>0){
+          for (let i = 0; i < maxTemp; i++) {
+            this.chapters.push({
+              ChapterId:i+1,
+              ChapterName:`第${i+1}次`
+            })
+            
+          }
+          this.currentCourse.ClassHours=maxTemp
+        }
+      }
+    },
     assembleHandler(){
       this.assemble = []
-      this.chapters.forEach(x=>{
+      this.chapters.forEach((x,i)=>{
         x.assemble=[]
         this.students.forEach(stu=>{
           const r = stu.CourseItems.find(item=>item.ChapterId==x.ChapterGradeNo)
-          x.assemble.push(r)
+          if(!r && (this.currentCourse.CourseRate==10||this.currentCourse.CourseRate==11) && stu.TotalTimes<(i+1)){
+            x.assemble.push({overlayer:true})
+          }else{
+            x.assemble.push(r)
+          }
+          
         })
       })
       this.$nextTick(()=>{
@@ -406,4 +431,8 @@ export default {
 .sptable .study-normal{
   background: #548235;
 }
+.sptable .disable-class{
+  background: #dfdfdf;
+  cursor: not-allowed;
+}
 </style>