0718-1

src/pages/Index/Index.vue

@@ -4,7 +4,7 @@
       <IndexSwiper :swiperList="swiperList"></IndexSwiper>
       <Dynamic :dynamic="dynamic"></Dynamic>
       <IndexService :activityList="activityList"></IndexService>
-      <DigitalResource :literature="literature"></DigitalResource>
+      <DigitalResource></DigitalResource>
       <IndexVideo :exhibition="exhibition"></IndexVideo>
       <Footer></Footer>
     </div>
@@ -138,7 +138,7 @@ export default {
   mounted () {
     this.getDynamicsList()
     this.getActivityList()
-    this.getLiterature()
+    // this.getLiterature()
     this.getExhibition()
     this.getSwiper()
   }

src/pages/Index/components/DigitalResource.vue

@@ -6,7 +6,7 @@
         <router-link to="/resource" class="more">MORE>></router-link>
       </div>
       <div class="digital-swiper">
-        <swiper :options="swiperOption">
+        <swiper :options="swiperOption" v-if="literature && literature.length > 0">
           <swiper-slide class="slide-box" v-for="(list,idx) in literature" :key="idx">
             <div class="digital-slide-box" @click="goDetail(list.newsContentLink, list.templateRecordUrl)" :title="list.newsContentTitle">
               <img :src="url + 'news/route/file/downloadfile/false/' + list.newsContentCoverList" alt="" class="digital-slide-img">
@@ -19,20 +19,37 @@
 </template>
 
 <script>
+import 'swiper/dist/css/swiper.css'
+import { swiper, swiperSlide } from 'vue-awesome-swiper'
+import axios from 'axios'
 import common from '@/common/components/common.js'
 export default {
   name: 'DigitalResource',
-  props: {
+  components: {
-    literature: Array
+    swiper,
+    swiperSlide
   },
+  // props: {
+  //   literature: Array
+  // },
   data () {
     return {
       swiperOption: {
+        observer: true,
+        observeParents: true,
         autoplay: 3000,
         slidesPerView: 5,
         spaceBetween: 30
       },
-      url: common.url
+      url: common.url,
+      literature: [],
+      literaturePage: {
+        page: 1,
+        rows: 8,
+        totalPage: 1,
+        newsDirectoriesId: '',
+        newsDirectoriesParentId: '98c74389-2088-499b-a046-8611bdc57ea4'
+      },
     }
   },
   methods: {
@@ -42,7 +59,21 @@ export default {
       } else {
         window.location.href = this.url + url
       }
+    },
+    getLiterature: function () {
+      var self = this
+      axios.get(self.url + 'news/app/newscontent/listpagenewscontentrelease', {
+        params: self.literaturePage
+      }).then(function (res) {
+        for (var i = 0; i < res.data.rows.length; i++) {
+          res.data.rows[i].newsContentCoverList = res.data.rows[i].newsContentCoverList[0].contentCoverId
+        }
+        self.literature = res.data.rows
+      })
     }
+  },
+  mounted: function () {
+    this.getLiterature()
   }
 }
 </script>

src/pages/Index/components/Swiper.vue

@@ -1,6 +1,6 @@
 <template>
     <div class="index-swiper">
-      <swiper ref="mySwiper" :options="swiperOptions" class="swiper-outer">
+      <swiper ref="mySwiper" :options="swiperOptions" class="swiper-outer" v-if="swiperList && swiperList.length > 0">
         <swiper-slide class="swiper-box" v-for="(swiper,idx) in swiperList" :key="idx">
           <img :src="url + 'news/route/file/downloadfile/false/' + swiper.newsContentCoverList" alt="" class="banner-img" @click="goDetail(swiper.templateRecordUrl)">
         </swiper-slide>
@@ -20,6 +20,7 @@ export default {
     return {
       swiperOptions: {
         pagination: '.swiper-pagination',
+        paginationClickable: true,
         // loop: true,
         autoplay: 3000
       },

src/pages/IntangibleHeritageDetail/IntangibleHeritageDetail.vue

@@ -23,6 +23,15 @@
           </tr>
         </table>
         <div class="heritage-text" v-html="heritageDetail.librarySummary"></div>
+        <div class="pic-swiper">
+          <swiper :options="swiperOption" v-if="heritageDetail.libraryCover && heritageDetail.libraryCover.length > 0">
+            <swiper-slide class="slide-box" v-for="(list,idx) in heritageDetail.libraryCover" :key="idx">
+              <div class="digital-slide-box" @click="goDetail(list.newsContentLink, list.templateRecordUrl)" :title="list.newsContentTitle">
+                <img :src="url + 'library/route/file/downloadfile/false/' + list" alt="" class="digital-slide-img">
+              </div>
+            </swiper-slide>
+          </swiper>
+        </div>
       </div>
       <div class="about-people">
         <h3>相关传承人</h3>
@@ -70,13 +79,19 @@ export default {
     return {
       heritageDetail: {},
       peopleList: [],
-      url: common.url
+      url: common.url,
+      swiperOption: {
+        autoplay: 3000,
+        slidesPerView: 5,
+        spaceBetween: 30
+      }
     }
   },
   methods: {
     getHeritageDetail () {
       var self = this
       axios.get(self.url + 'library/app/intangiblelibrary/getintangiblelibrarybyidrelease/' + this.$route.params.id).then(function (res) {
+        res.data.libraryCover = res.data.libraryCover.split(',')
         self.heritageDetail = res.data
         self.getPeopleList()
       })
@@ -180,4 +195,9 @@ export default {
       text-overflow ellipsis
       padding 0 5px
       font-family '宋体'
+.pic-swiper
+  margin-top 10px
+  img
+    width 215px
+    height 260px
 </style>