播放记录

src/pages/person-center/play-record/index.vue

@@ -2,30 +2,37 @@
   <div class="play-record">
     <div class="play-record__header clearfix">
       播放记录
-      <a class="clear-btn">清空记录</a>
+      <!-- <a class="clear-btn">清空记录</a> -->
     </div>
     <div class="play-record__body">
-      <div class="date-item" v-for="(item, index) in recordList" :key="index">
-        <div class="date-item__header">{{ item.date }}</div>
+      <div class="date-item" v-for="(v, k) in recordList" :key="k">
+        <div class="date-item__header">{{ k }}</div>
         <div class="date-item__body">
           <div class="list">
-            <div class="course-item">
-              <div class="course-item__header">{{ item.sectionName }}</div>
+            <div
+              class="course-item"
+              v-for="(sectionItem, sectionIndex) in v.list"
+              :key="'section' + sectionIndex"
+            >
+              <div class="course-item__header">{{ sectionItem.goodsName }}</div>
               <div class="course-item__body">
                 <div
                   class="img"
                   @click="
-                    go('/my-course-detail/' + item.goodsId, {
-                      gradeId: item.gradeId,
-                      orderGoodsId: item.orderGoodsId,
+                    go('/my-course-detail/' + sectionItem.goodsId, {
+                      gradeId: sectionItem.gradeId,
+                      orderGoodsId: sectionItem.orderGoodsId,
                     })
                   "
                 >
-                  <img :src="$tools.splitImgHost(item.coverUrl, true)" alt="" />
+                  <img
+                    :src="$tools.splitImgHost(sectionItem.coverUrl, true)"
+                    alt=""
+                  />
                 </div>
                 <div class="text">
                   <div class="title">
-                    {{ item.goodsName }}
+                    {{ sectionItem.sectionName }}
                     <!-- <div class="note">60学时</div> -->
                   </div>
                   <div class="progress">
@@ -36,17 +43,19 @@
                       :stroke-width="16"
                       :percentage="
                         toFixed(
-                          (item.videoCurrentTime / item.durationTime) * 100
+                          (sectionItem.videoCurrentTime /
+                            sectionItem.durationTime) *
+                            100
                         )
                       "
                     ></el-progress>
                   </div>
                 </div>
-                <div class="btns-wrap">
+                <!-- <div class="btns-wrap">
                   <div class="btns">
                     <div class="btn btn--warm">删除记录</div>
                   </div>
-                </div>
+                </div> -->
               </div>
             </div>
           </div>
@@ -76,7 +85,7 @@ export default {
   data() {
     return {
       activeName: "1",
-      recordList: [],
+      recordList: {},
       total: 0,
       params: {
         pageNum: 1,
@@ -112,7 +121,17 @@ export default {
     },
     studRrecordListUserRecord() {
       this.$request.studRrecordListUserRecord(this.params).then((res) => {
-        this.recordList = res.rows;
+        let dateObj = {};
+
+        res.rows.forEach((row) => {
+          if (!dateObj[row.date]) {
+            dateObj[row.date] = { title: row.goodsName, list: [] };
+            dateObj[row.date].list.push(row);
+          } else {
+            dateObj[row.date].list.push(row);
+          }
+        });
+        this.recordList = dateObj;
         this.total = res.total;
       });
     },