<import
  name="contents-list"
  src="../../components/contents/contents-list.ux"
></import>
<template>
  <div class="page-wrapper">
    <div class="title-bar">
      <text class="text-black">共{{ total }}章</text>
      <div @click="switchOrder">
        <text class="text-primary iconfont">{{
          reverse ? '&#xe624;' : '&#xe6d6;'
        }}</text>
        <text class="text-primary">{{ reverse ? '正序' : '倒序' }}</text>
      </div>
    </div>
    <contents-list list="{{contents}}" ondetail="detail"></contents-list>
    <div class="bottom-bar">
      <text
        @click="switchPage('last')"
        class="btn-primary {{pageNo === 1 ? 'btn-disabled' : ''}}"
        >上一页</text
      >
      <text>{{ pageNumStart }}-{{ pageNumEnd }}章</text>
      <text
        @click="switchPage('next')"
        class="btn-primary {{pageNo === pageCount ? 'btn-disabled' : ''}}"
        >下一页</text
      >
    </div>
  </div>
</template>

<script>
import { contentsData } from '../../assets/data/contents.js'
export default {
  public: {
    bookId: '',
    bookTitle: ''
  },
  private: {
    total: '',
    pageNumStart: 1,
    pageNumEnd: 50,
    pageNo: 1,
    pageCount: 2,
    reverse: false,
    contents: [],
    lastList: [],
    nextList: []
  },
  onInit() {
    // 开发时应该调用接口，根据bookId，pageNo(1), reverse(false)获取章节目录，返回第一页内容contents，总章节数total，总页数pageCount，算出pageNumStart和pageNumEnd。
    this.total = contentsData[this.bookId].length
    this.lastList = contentsData[this.bookId].slice(0, 50)
    this.nextList = contentsData[this.bookId].slice(50)
    console.log('bookId', this.bookId)
    this.contents = this.lastList
  },
  /* -------------------SelfCustomEvent------------------ */
  switchOrder() {
    this.reverse = !this.reverse
    this.switchList()
  },
  switchPage(type) {
    if (
      (type === 'next' && this.pageNo === this.pageCount) ||
      (type === 'last' && this.pageNo === 1)
    ) {
      return
    }
    type === 'next' ? this.pageNo++ : this.pageNo--
    this.switchList()
  },
  switchList() {
    // 开发时应该调用接口，根据bookId,pageNo,reverse获取章节目录。此处是模拟翻页/改变顺序。
    if (this.reverse) {
      if (this.pageNo === 1) {
        this.pageNumStart = contentsData[this.bookId].length
        this.pageNumEnd = 51
        this.contents = this.nextList.reverse()
      } else if (this.pageNo === 2) {
        this.pageNumStart = 50
        this.pageNumEnd = 1
        this.contents = this.lastList.reverse()
      }
    } else {
      if (this.pageNo === 1) {
        this.pageNumStart = 1
        this.pageNumEnd = 50
        this.contents = this.lastList
      } else if (this.pageNo === 2) {
        this.pageNumStart = 51
        this.pageNumEnd = contentsData[this.bookId].length
        this.contents = this.nextList
      }
    }
  },
  detail(param) {
    let item = param.detail.item
    $utils.route2theUrl('pages/book-content', {
      bookId: this.bookId,
      bookTitle: this.bookTitle,
      chapterId: contentsData[this.bookId].indexOf(item) + 1 || 0,
      total: contentsData[this.bookId].length
    })
  }
}
</script>

<style lang="less">
@import '../../assets/styles/index.less';
.g22kjdgy {
  color: #ffffff;
}
</style>
