Merge pull request '作业批阅：新增空列表展示与loading加载效果' (#192) from baigl into main

Reviewed-on: #192

src/renderer/src/views/classTask/classTask.vue

@@ -27,24 +27,35 @@
       </div>
     </div>
     <div class="class-reserv-body">
-      <task-item
-        v-for="(item, index) in activeDataList"
-        v-show="tabActive === '进行中'"
-        :key="index"
-        :item="item"
-        :tabactive="tabActive"
-        @click="onClickItem(item)"
-        @delete-reserv="deleteReserv(item)"
-      ></task-item>
-      <task-item
-        v-for="(item, index) in doneDataList"
-        v-show="tabActive === '已结束'"
-        :key="index"
-        :item="item"
-        :tabactive="tabActive"
-        @click="onClickItem(item)"
-        @delete-reserv="deleteReserv(item)"
-      ></task-item>
+      <!-- loading  <el-skeleton :rows="5" animated />-->
+      <el-skeleton :rows="5" :loading="loading" animated />
+      <div v-if="classWorkList.length > 0">
+        <task-item
+          v-for="(item, index) in activeDataList"
+          v-show="tabActive === '进行中'"
+          :key="index"
+          :item="item"
+          :tabactive="tabActive"
+          @click="onClickItem(item)"
+          @delete-reserv="deleteReserv(item)"
+        ></task-item>
+        <task-item
+          v-for="(item, index) in doneDataList"
+          v-show="tabActive === '已结束'"
+          :key="index"
+          :item="item"
+          :tabactive="tabActive"
+          @click="onClickItem(item)"
+          @delete-reserv="deleteReserv(item)"
+        ></task-item>
+      </div>
+      <div v-else> 
+        <el-empty
+          v-show="classWorkList.length == 0 && !loading"
+          :description="'暂无'+tabActive+'作业数据'"
+          style="width: 100%; height: 400px"
+        ></el-empty>
+      </div>
     </div>
     <item-dialog ref="itemDialogRef" @cle-click="closeDialog"></item-dialog>
   </el-container>
@@ -99,6 +110,8 @@ const changeEndDate = (val) => {
 
 // 获取数据
 const getData = () => {
+  classWorkList.value = []
+  loading.value = true
   // 1、班级列表
   getClassList()
   // 2、班级作业
@@ -181,6 +194,9 @@ const getClassWorkList = () => {
         classWorkList.value = response.rows && response.rows.filter((item) => item.workdatacount > 0)
         //TODO： 这里没分页，貌似这个 total 不重要，后续看
         total.value = response.total
+      }else{
+        classWorkList.value = []
+        total.value = 0
       }
       loading.value = false
     })
@@ -402,9 +418,7 @@ watch(
 )
 watch(tabActive, (newVal,oldVal)=>{
   console.log('newVal',newVal);
-  setTimeout(() => {
-    getData() // 加载数据
-  }, 300)
+  getData() // 加载数据
 })
 </script>