修改样式

src/views/classList/index.module.less

@@ -613,6 +613,12 @@
 .trainingDetails {
   padding: 24px 0 32px;
 
+  :global {
+    .n-scrollbar {
+      min-height: 280px
+    }
+  }
+
   .studentList {
     display: flex;
     flex-direction: row;
@@ -749,8 +755,8 @@
     // width: 100%;
 
     .expireDateIcon {
-      width: max(13px, 12Px);
-      height: max(13px, 12Px);
+      width: 13Px;
+      height: 13Px;
       display: inline-block;
       background: url('../prepare-lessons/images/icon-expiredate.svg') no-repeat center;
       background-size: contain;
@@ -776,6 +782,7 @@
 
     &>div {
       width: calc(33.33% - 20px);
+      margin-bottom: 20px;
     }
   }
 
@@ -789,7 +796,7 @@
   }
 
   .btnGroups {
-    padding: 40px 0;
+    padding: 12px 32px 0 !important;
 
     :global {
       .n-button {

src/views/classList/modals/TrainingDetails.tsx

@@ -5,7 +5,8 @@ import {
   NImage,
   NScrollbar,
   NSpin,
-  NModal
+  NModal,
+  NTooltip
 } from 'naive-ui';
 import { defineComponent, onMounted, reactive, ref } from 'vue';
 import { getTrainingStudentDetail } from '../api';
@@ -86,7 +87,12 @@ export default defineComponent({
           return {
             ...item,
             coverImg: item.titleImg,
-            fileList: (item.fileJsonList && item.fileJsonList[0]) || {},
+            fileList:
+              (item.fileJsonList && {
+                ...item.fileJsonList[0],
+                expireFlag: true
+              }) ||
+              {},
             allTimes: JSON.parse(item.trainingContent).trainingTimes,
             typeList: tList || []
           };
@@ -160,16 +166,34 @@ export default defineComponent({
               ) : null}
             </div>
 
-            {studnetInfo.value.expireFlag && (
+            {studnetInfo.value.expireFlag ? (
               <NButton
                 onClick={() => (showModalMask.value = true)}
                 class={styles.commentBtnGroup}>
                 <div class={styles.text}>
-                  <i class={studnetInfo.value.comment && styles.look}></i>
+                  <i></i>
 
                   {studnetInfo.value.comment ? '修改点评' : '点评作业'}
                 </div>
               </NButton>
+            ) : (
+              <NTooltip showArrow={false}>
+                {{
+                  trigger: () => (
+                    <NButton
+                      disabled
+                      onClick={() => (showModalMask.value = true)}
+                      class={styles.commentBtnGroup}>
+                      <div class={styles.text}>
+                        <i></i>
+
+                        {studnetInfo.value.comment ? '修改点评' : '点评作业'}
+                      </div>
+                    </NButton>
+                  ),
+                  default: '作业截止后可点评作业'
+                }}
+              </NTooltip>
             )}
           </div>
 
@@ -183,11 +207,11 @@ export default defineComponent({
             </div>
           )}
 
-          <NScrollbar style="max-height:400px;min-height: 300px" trigger="none">
+          <NScrollbar style="max-height:400px;" trigger="none">
             <div class={styles.workList}>
               {studnetInfo.value.studentLessonTrainingDetails.map(
                 (item: any) => (
-                  <WorkItem style={{ marginBottom: '20px' }} item={item} />
+                  <WorkItem item={item} />
                 )
               )}
             </div>

src/views/classList/work-item/index.module.less

@@ -10,6 +10,19 @@
     border-color: #198CFE;
     transform: scale(1.01);
   }
+
+  &.work-content-disabled {
+    &:hover {
+      transition: all .2s ease;
+      border-color: #ECEDEF;
+      transform: scale(1);
+      cursor: not-allowed;
+    }
+
+    .expireBg {
+      cursor: not-allowed;
+    }
+  }
 }
 
 .work-content {
@@ -38,7 +51,7 @@
   .nodata {
     width: 132px !important;
     height: 127px !important;
-    cursor: default !important;
+    cursor: not-allowed !important;
   }
 
   .reportBtn {

src/views/classList/work-item/index.tsx

@@ -41,7 +41,11 @@ export default defineComponent({
     });
 
     return () => (
-      <div class={styles.workItem}>
+      <div
+        class={[
+          styles.workItem,
+          props.item.fileList?.expireFlag && styles['work-content-disabled']
+        ]}>
         <div
           class={[styles['work-content']]}
           style={{