src/renderer/src/utils/date.js

@@ -88,6 +88,9 @@ export const getCurrentTime = (format)=> {
   const day = now.getDate().toString().padStart(2, '0');
   const hours = now.getHours().toString().padStart(2, '0');
   const minutes = now.getMinutes().toString().padStart(2, '0');
+  if(format == 'YYYY-MM-DD HH:mm'){
+    return `${year}-${month}-${day} ${hours}:${minutes}`;
+  } 
   if(format == 'YYYY-MM-DD'){
     return `${year}-${month}-${day}`;
   }

src/renderer/src/views/desktop/container/work-trend.vue

@@ -1,22 +1,26 @@
 <template>
-  <div class="desktop-item">
+  <div class="desktop-work-item">
     <div class="item-title flex">
       <span>工作动态</span>
-      <el-radio-group v-model="type">
+      <el-radio-group v-model="type" @change="changeTab">
         <el-radio-button label="全部" :value="-1" />
         <el-radio-button label="备课" :value="1" />
         <el-radio-button label="上课" :value="2" />
         <el-radio-button label="作业" :value="3" />
       </el-radio-group>
     </div>
-    <div class="item-content">
+    <div class="item-content" v-loading="loading">
+      <el-scrollbar height="500px">
         <ul>
+           <!--上课-->
+          <template v-if="type == 2 || type == -1">
             <li class="flex class-item" v-for="item in classList" :key="item.id">
               <div class="class-left flex">
                 <div class="class-name flex">
-              <span>{{ item.className }}</span>
+                  <span class="name">{{ item.className }}</span>
                 </div>
-            <div class="class-time"> {{ item.classDay }}&nbsp;{{ item.startTime }} ~ {{ item.classDay }}&nbsp;{{ item.endTime }}</div>
+                <div class="class-time"> {{ item.classDay }}&nbsp;{{ item.startTime }} ~ {{ item.classDay }}&nbsp;{{
+                  item.endTime }}</div>
                 <div class="class-grade">
                   <span v-for="(tag, index) in item.classItemList" :key="index" style="margin-left: 5px">
                     {{ index === 0 ? tag.name : '、' + tag.name }}
@@ -27,36 +31,102 @@
                 <el-button type="primary" size="small">上课</el-button>
               </div>
             </li>
+          </template>
+          <!--作业-->
+          <template v-if="type == 3 || type == -1">
+            <li class="flex class-item home-list" v-for="item in homeworkList" :key="item.id">
+              <div class="class-left flex">
+                <div class="class-name flex">
+                  <span class="name">{{ item.uniquekey }}</span>
+                  <el-tag class="tag" round :type="tagType(item.deaddate)" effect="dark" size="small">{{
+                    getCurrentTime('YYYY-MM-DD HH:mm') > item.deaddate ? '已结束' : '进行中' }}</el-tag>
+                </div>
+                <div class="class-time">{{ item.classcaption }} | 截止时间：{{ item.deaddate }} </div>
+              </div>
+              <div class="class-right">
+                <div><span class="num">{{ item.workdataresultcount }}</span> / {{ item.workdatacount }}</div>
+                <div>已交</div>
+              </div>
+            </li>
+          </template>
         </ul>
+      </el-scrollbar>
     </div>
   </div>
 </template>
 <script setup>
 import { ref, onMounted } from 'vue'
+import useUserStore from '@/store/modules/user'
 import { getSelfReserv } from '@/api/classManage'
+import { homeworklist } from '@/api/teaching/classwork'
+import { getCurrentTime } from '@/utils/date'
 
 const type = ref(-1)
+const user = useUserStore().user
+const loading = ref(false)
 const classList = ref([])
+const homeworkList = ref([])
 
 // 获取上课
-  const getClass = () =>{
+const getClass = async () => {
-    getSelfReserv().then((res) => {
+  loading.value = true
+  try {
+    const res =  await getSelfReserv()
     let list = res.data || []
     list.sort((a, b) => { if (a.status == '上课中') return -1; else return 0 })
     classList.value = list.filter(item => item.status !== '已结束')
-
+  } finally {
+    loading.value = false
+  }
+}
+// 获取作业
+const getHomework = async () => {
+  loading.value = true
+  const { edustage, edusubject } = user
+  try {
+    const { rows } = await homeworklist({ edituserid: user.userId, edustage, edusubject, orderby: 'uniquekey DESC', pageSize: 500 })
+    homeworkList.value = rows.filter(item => item.deaddate && item.uniquekey)
+    homeworkList.value.forEach((item) => {
+      item.workdatacount = JSON.parse('[' + item.classworkdatastudentids + ']').length
     })
+  } finally {
+    loading.value = false
+  }
+}
+
+const tagType = (time) => {
+  return getCurrentTime('YYYY-MM-DD HH:mm') > time ? 'info' : 'warning'
+}
+// 切换
+const changeTab = (val) =>{
+
+  console.log(type.value)
+  switch(val){
+    case -1:
+      getClass()
+      getHomework()
+      break;
+    case 1:
+      break;
+    case 2:
+      getClass()
+      break;
+    default: 
+      getHomework()
+  }
 }
 
 onMounted(() => {
   getClass()
+  getHomework()
 })
 </script>
 
 <style lang="scss" scoped>
-  .desktop-item{
+.desktop-work-item {
-    margin-bottom: 20px;
   align-items: center;
+  height: 100%;
+
   .item-title {
     height: 32px;
     text-align: left;
@@ -66,27 +136,76 @@ import { getSelfReserv } from '@/api/classManage'
     align-items: center;
     justify-content: space-between;
   }
+
   .item-content {
     background-color: #fff;
     border-radius: 5px;
     padding: 10px 15px;
     font-size: 13px;
+    height: calc(100% - 60px);
+
     .class-item {
       justify-content: space-between;
       align-items: center;
-        background: #e2e4f4;
+      background: #eff5fa;
       border-radius: 5px;
       margin-bottom: 10px;
       padding: 10px;
+
       .class-left {
         flex-direction: column;
         align-items: flex-start;
+        width: 90%;
+
+        .class-name {
+          display: flex;
+          align-items: center;
+
+          .name {
+            font-size: 14px;
+            font-weight: bold;
+          }
+
+          .tag {
+            margin-left: 5px;
+            border: none;
+
+            :deep(.el-tag__content) {
+              font-size: 12px;
+            }
+          }
+        }
+
         .class-time {
           font-size: 13px;
-            color: #bfbfbf;
+          color: #a5a4a4;
+          padding-top: 3px;
+          width: 100%;
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          text-align: left;
+        }
+      }
+
+      .class-right {
+        font-size: 12px;
+        color: #a5a4a4;
+        flex-shrink: 0;
+        font-size: 13px;
+
+        .num {
+          font-size: 14px;
+          color: #409EFF;
+          font-weight: bold;
         }
       }
     }
+
+    .class-grade {
+      padding-top: 3px
+    }
+
   }
 }
 </style>