<template>
  <view class="container">
    <!-- 图书列表 -->
    <view class="list-box">
      <book-list-item
        v-for="(item, index) in bookList"
        :key="index"
        :data="item"
        :ranking="index + 1"
        @click="goToDetail(item)"
      />
    </view>

    <!-- 加载提示 -->
    <view class="load-tip" v-if="loading">加载中...</view>
    <view class="load-tip" v-if="noMore">没有更多了</view>
  </view>
</template>

<script>
import bookListItem from "@/components/book-list-item/book-list-item.vue";
import { FetchInitScreenBookRecommend } from '@/api/book';

export default {
  components: {
    bookListItem
  },
  data() {
    return {
      bookList: [],       // 图书列表
      loading: false,     // 加载状态
      noMore: false       // 是否到底
    };
  },
  onLoad() {
    this.getBookRecommendList();
  },
  // 下拉刷新
  onPullDownRefresh() {
    this.refresh();
  },
  methods: {
    // 刷新
    refresh() {
      this.bookList = [];
      this.noMore = false;
      this.getBookRecommendList();
    },

    // 获取【真实】图书推荐列表（和首页同源）
    async getBookRecommendList() {
      this.loading = true;
      try {
        const res = await FetchInitScreenBookRecommend({ libcode: '1201' });
        this.bookList = res.data || [];
        this.noMore = true; // 推荐数据一次性返回，没有分页
      } catch (err) {
        console.error('获取推荐图书列表失败：', err);
      } finally {
        this.loading = false;
        uni.stopPullDownRefresh();
      }
    },

    // 跳详情
    goToDetail(item) {
      uni.navigateTo({
        url: "/subpkg/pages/book-detail/book-detail?isbn=" + item.isbn
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.container {
  padding: 10px;
  background-color: #f5f5f5;
  min-height: 100vh;
}

.list-box {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.load-tip {
  text-align: center;
  padding: 15px;
  font-size: 14px;
  color: #999;
}
</style>