1回答

城歌

提问者

2020-11-08

<template>
 <div v-if="!loading">
   <detail-book
     :book="book"
   />
   <detail-stat
     :readers="book.readers"
     :readerNum="book.readerNum"
     :rankNum="book.rankNum"
     :rankAvg="book.rankAvg"
   />
   <detail-rate
     :rate-value="book.rateValue"
     @onRateChange="onRateChange"
   />
   <detail-contents
     :contents="contents"
     @readBook="readBook"
   />
 </div>
</template>

<script>

import DetailBook from '../../components/detail/DetailBook'
import { getStorageSync } from '../../api/wechat'
import { bookContents, bookDetail, bookRankSave } from '../../api'
import DetailStat from '../../components/detail/DetailStat'
import DetailRate from '../../components/detail/DetailRate'
import DetailContents from '../../components/detail/DetailContents'

export default {
 components: {DetailContents, DetailRate, DetailStat, DetailBook},
 data() {
   return {
     book: {},
     contents: [],
     loading: true
   }
 },
 methods: {
   getBookDetail() {
     const openId = getStorageSync('openId')
     const {fileName} = this.$route.query
     if (openId && fileName) {
       bookDetail({openId, fileName}).then(response => {
         this.book = response.data.data
       })
     }
   },
   onRateChange(value) {
     const openId = getStorageSync('openId')
     const {fileName} = this.$route.query
     bookRankSave({
       openId,
       fileName,
       rank: value
     }).then(() => {
       this.getBookDetail()
     })
   },
   getBookContents() {
     const {fileName} = this.$route.query
     if (fileName) {
       bookContents({
         fileName
       }).then(res => {
         this.contents = res.data.data
         this.$nextTick(() => {
           this.loading = false
         })
       })
     }
   },
   readBook(href) {
     console.log(href)
   }
 },
 mounted() {
   this.loading = true
   this.getBookDetail()
   this.getBookContents()
 }
}
</script>

<style lang="scss" scoped>
</style>

0

0