paper collect

src/views/questioncenter/components/collect-paper-item.vue

@@ -0,0 +1,48 @@
+<template>
+  <div class="fx-row gap20 fx-bet-cen bd-ddd pd20">
+    <div class="fx-column gap10">
+      <div class="f-333 f16 bold">{{paper.papername}}</div>
+      <i class="el-icon-alarm-clock f14 f-666">
+        <span class="ml10">{{paper.readNum}}人已预览</span>
+      </i>
+    </div>
+    <div class="fx-row gap10 ai-cen">
+      <mx-collect-button :value="paper.collect" />
+      <el-button type="primary" plain @click="toPreView(paper)">
+        <i class="el-icon-view f-yellow"></i>
+        <span class="ml5">预览</span>
+      </el-button>
+      <el-button type="primary" @click="paperDownLoad(paper)">
+        <i class="el-icon-download"></i>
+        <span class="ml5">下载</span>
+      </el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import MxCollectButton from "@/components/MxCollectButton/MxCollectButton.vue";
+import PaperActionsMixin from "@/views/questioncenter/components/paper-actions-mixin";
+
+export default {
+  name: "collect-paper-item",
+  components: {MxCollectButton},
+  mixins: [PaperActionsMixin],
+  props: {
+    paper: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  provide() {
+    return {
+      collectFn: () => this.collect(this.paper),
+      collectCancelFn: () => this.cancelCollect(this.paper)
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/questioncenter/components/collect.vue

@@ -14,35 +14,9 @@
       </div>
       <!-- 试卷收藏 -->
       <div class="exam" v-show="queryParams.favCollectType == 'paper'">
-        <div class="paper_container">
-          <div class="paper_item" v-for="item in collectPaper" :key="item.id">
-            <div class="tit">
-              <div>{{ item.papername }}</div>
-              <div class="viewCount">
-                <img src="@/assets/images/icon_eye.png" alt=""/>
-                <span>{{ item.readNum }}人已预览</span>
-              </div>
-            </div>
-            <div class="opera">
-              <div class="view" @click="toPreView(item)">
-                <img
-                  class="mr8"
-                  src="@/assets/images/icon_view.png"
-                  alt=""
-                />
-                <span>预览</span>
-              </div>
-              <div class="download">下载</div>
-              <div>
-                <img
-                  src="@/assets/images/icon_shoucang_s.png"
-                  alt=""
-                  class="mr8"
-                />
-                <span>已收藏</span>
-              </div>
-            </div>
-          </div>
+        <div class="fx-column gap10">
+          <collect-paper-item v-for="p in collectPaper" :key="p.id" :paper="p" />
+          <el-empty v-if="!loading && !collectPaper.length" />
         </div>
       </div>
     </div>
@@ -65,10 +39,12 @@ import {favPapers, favQuestions, favSubjects} from '@/api/webApi/webQue.js'
 import PaperActionsMixin from "@/views/questioncenter/components/paper-actions-mixin";
 import MxQuestionReadonly from "@/components/MxQuestionReadonly/MxQuestionReadonly.vue";
 import CorrectQuestionDialog from "@/components/MxPaper/plus/correct-question-dialog.vue";
+import CollectPaperItem from "@/views/questioncenter/components/collect-paper-item.vue";
 
 export default {
   mixins: [PaperActionsMixin],
   components: {
+    CollectPaperItem,
     CorrectQuestionDialog,
     MxQuestionReadonly,
     MxCondition,
@@ -128,7 +104,6 @@ export default {
       } else {
         this.getFavPapers()
       }
-
     },
     onChangePage() {
       this.getFavQuestions()
@@ -147,13 +122,9 @@ export default {
         this.$nextTick(_ => this.mxGlobal.MathQueue('collect-question'))
       }).finally(() => this.loading = false)
     },
-    viewDetail(item) {
-      item.expand = !item.expand
-    },
     // 收藏涉及的学科
     getSubjects() {
       favSubjects({type: this.form.type}).then((res) => {
-        console.log(res)
         this.form.subjectName = res.data[0]
         this.subjects = res.data
         if (this.form.type == 'question') {
@@ -165,15 +136,15 @@ export default {
     },
     // 收藏涉及的试卷
     getFavPapers() {
+      this.loading = true
       favPapers({
         subjectName: this.queryParams.favSubject,
         pageNum: this.pageForm.pageNum,
         pageSize: this.pageForm.pageSize
       }).then((res) => {
-        console.log(res)
         this.pageForm.total = res.total
         this.collectPaper = res.rows
-      })
+      }).finally(() => this.loading = false)
     }
   }
 }

src/views/questioncenter/components/paper-actions-mixin.js

@@ -1,8 +1,12 @@
 import {downloadRealPaper, papersCancelCollect, papersCollect} from "@/api/webApi/webQue";
 import MxConst from "@/common/MxConst";
 import {downloadOssFile} from "@/utils/download-helper";
+import {mapGetters} from "vuex";
 
 export default {
+  computed: {
+    ...mapGetters(['period'])
+  },
   methods: {
     _combineOssPath(item) {
       const {osspath, filename} = item