加入rowkey

TEAMModelOS.SmartClass/ClientApp/static/lessonDetails.json

@@ -1086,6 +1086,7 @@
     ]
   },
   {
+    "rowKey": 3,
     "data": {
       "activityStatusTip": "已结束",
       "commentCount": 52,
@@ -1447,6 +1448,7 @@
     ]
   },
   {
+    "rowKey": 4,
     "data": {
       "activityStatusTip": "已结束",
       "commentCount": 52,
@@ -1808,6 +1810,7 @@
     ]
   },
   {
+    "rowKey": 5,
     "data": {
       "activityStatusTip": "已结束",
       "commentCount": 52,
@@ -2169,6 +2172,7 @@
     ]
   },
   {
+    "rowKey": 6,
     "data": {
       "activityStatusTip": "已结束",
       "commentCount": 52,
@@ -2530,6 +2534,7 @@
     ]
   },
   {
+    "rowKey": 7,
     "data": {
       "activityStatusTip": "已结束",
       "commentCount": 52,
@@ -2891,6 +2896,7 @@
     ]
   },
   {
+    "rowKey": 8,
     "data": {
       "activityStatusTip": "已结束",
       "commentCount": 52,
@@ -3252,6 +3258,7 @@
     ]
   },
   {
+    "rowKey": 9,
     "data": {
       "activityStatusTip": "已结束",
       "commentCount": 52,

TEAMModelOS.SmartClass/ClientApp/view/smart-class/LessonDetails.vue

@@ -7,6 +7,17 @@
       <div class="activity-brief center-row">
         <div class="activity-brief-left">
           <!--<img :src="getThumb(rowKey)" width="100%" />-->
+          <div class="img-box">
+            <span class="state" style="background: rgb(130, 147, 166); visibility: visible;">{{activityInfo.activityStatusTip}}</span>
+            <!--<img :src="getThumb(item.rowKey)" alt="">-->
+            <div class="lesson-image">
+              <p style="font-size:24px">高新区智慧课堂优秀课例</p>
+              <p style="font-size:16px;margin:5px 0">{{activityInfo.parentGradeName}}</p>
+              <p style="font-size:28px;">《 {{activityInfo.parentProjectName}} 》</p>
+              <p style="font-size:16px;margin-top:8px;">{{activityInfo.schoolName}} {{activityInfo.speaker}}教师 执教</p>
+              <p style="font-size:16px;margin-top:8px;">授课平台：{{activityInfo.parentTeachePlateName}}</p>
+            </div>
+          </div>
         </div>
         <div class="activity-brief-right">
           <div class="activity-brief-title">
@@ -268,7 +279,7 @@
       .details-container .activity-brief .activity-brief-left {
         width: 30%;
         height: 100%;
-        padding: 40px 20px 0 20px;
+        padding: 30px 20px 0 20px;
       }
 
       .details-container .activity-brief .activity-brief-right {
@@ -408,4 +419,29 @@
         font-weight:bold;
         border-bottom: 1px solid #f6f6f6;
     }
+
+    .img-box {
+          background:url(../../assets/image/lessonCover.png);
+          height: 210px
+      }
+
+        .img-box .lesson-image {
+          display:flex;
+          flex-direction:column;
+          justify-content:center;
+          align-items:center;
+          color:#fff;
+          font-weight:bold;
+        }
+
+      .img-box .state {
+          padding: 5px 8px;
+          line-height: 20px;
+          position: relative;
+          left: 0;
+          top: 3px;
+          z-index: 1;
+          background-color: #13ce66;
+          color: #fff
+      }
 </style>

TEAMModelOS.SmartClass/ClientApp/view/smart-class/LessonList.vue

@@ -9,22 +9,22 @@
       <div class="activity" v-for="(item,index) in lessons" @click="handleLessonClick(item.rowKey)">
         <div>
           <div class="img-box">
-          <span class="state" style="background: rgb(130, 147, 166); visibility: visible;">{{item.activityStatusTip}}</span>
+            <span class="state" style="background: rgb(130, 147, 166); visibility: visible;">{{item.data.activityStatusTip}}</span>
           <!--<img :src="getThumb(item.rowKey)" alt="">-->
             <div class="lesson-image">
               <p style="font-size:24px">高新区智慧课堂优秀课例</p>
-              <p style="font-size:16px;margin:5px 0">六年级</p>
-              <p style="font-size:28px;">《 速度与激情 》</p>
-              <p style="font-size:16px;margin-top:8px;">高新区益民学校 钟源教师 执教</p>
-              <p style="font-size:16px;margin-top:8px;">授课平台：网奕HiTeach</p>
+              <p style="font-size:16px;margin:5px 0">{{item.data.parentGradeName}}</p>
+              <p style="font-size:28px;">《 {{item.data.parentProjectName}} 》</p>
+              <p style="font-size:16px;margin-top:8px;">{{item.data.schoolName}} {{item.data.speaker}}教师 执教</p>
+              <p style="font-size:16px;margin-top:8px;">授课平台：{{item.data.parentTeachePlateName}}</p>
             </div>
           </div>
           <div class="infos">
-              <p>名称：{{item.mainActivityName}}</p>
-              <p>学校：{{item.schoolName}}</p>
-              <p>主讲：{{item.speaker}}</p>
-              <p>学科：{{item.categoryName}}</p>
-              <p>时间：{{item.timeTip}}</p>
+            <p>名称：{{item.data.name}}</p>
+            <p>学校：{{item.data.schoolName}}</p>
+            <p>主讲：{{item.data.speaker}}</p>
+            <p>学科：{{item.data.parentCategoryName}}</p>
+            <p>时间：{{item.data.timeRangeTip}}</p>
           </div>
         </div>
       </div>
@@ -33,6 +33,7 @@
 </template>
 <script>
     import lessons from '@/static/observationList.json'
+    import lessonDetails from '@/static/lessonDetails.json'
   export default {
     components: {
     },
@@ -43,7 +44,7 @@
     },
 
     created() {
-      this.lessons = lessons.list;
+      this.lessons = lessonDetails;
     },
     methods: {
       getList(type) {
@@ -118,7 +119,7 @@
 }
 
 .img-box {
-    background:#13ce66;
+    background:url(../../assets/image/lessonCover.png);
     height: 210px
 }