Browse Source

东西湖新书推荐显示问题

master
xuhuajiao 3 weeks ago
parent
commit
b068e40355
  1. 171
      src/views/newBookRecommend/index-old.vue
  2. 769
      src/views/newBookRecommend/index.vue

171
src/views/newBookRecommend/index-old.vue

@ -0,0 +1,171 @@
<template>
<!-- 新书推荐 -->
<div class="screen-item lending-ranking">
<div class="common-title">图书推荐</div>
<div ref="newbook" class="big-module module-content">
<swiper v-if="rankingList.length > 1" ref="swiperThumbs" class="swiper gallery-thumbs directive" :options="swiperOptionThumbs">
<swiper-slide v-for="(item,index) in rankingList" :key="index" class="slide-1">
<div class="newbook-list-item">
<div class="book-img">
<img :src="item.cover" :onerror="defaultImg">
</div>
<div class="book-info">
<h4 class="title-item">{{ item.nbName }}</h4>
<p>{{ item.nbAuthor }}</p>
</div>
<!-- <div class="ranking-num">
<svg v-if="index === 0" class="icon" aria-hidden="true">
<use xlink:href="#icon-a-no1" />
</svg>
<svg v-if="index === 1" class="icon" aria-hidden="true">
<use xlink:href="#icon-a-no21" />
</svg>
<svg v-if="index === 2" class="icon" aria-hidden="true">
<use xlink:href="#icon-a-no3" />
</svg>
<p>NO.{{ index+1 }}</p>
</div> -->
</div>
</swiper-slide>
</swiper>
</div>
</div>
</template>
<script>
import { FetchNewBookRecommend, FetchCoverByISBN } from '@/api/library'
import { swiper, swiperSlide } from 'vue-awesome-swiper'
import 'swiper/dist/css/swiper.css'
// import data from './data.json'
export default {
name: 'NewBookRecommend',
components: {
swiper,
swiperSlide
},
data() {
return {
defaultImg: 'this.src="' + require('@/assets/images/default-img.png') + '"',
rankingList: [],
swiperOptionThumbs: {
loopedSlides: 6,
direction: 'vertical',
slidesPerView: 6,
slidesPerGroup: 6,
slidesPerColumn: 2,
autoplay: true
// centeredSlides: true,
// autoScrollOffset: true
}
}
},
computed: {
swiper() {
return this.$refs.swiperThumbs.swiper
}
},
created() {
},
mounted() {
// this.rankingList = data
this.getNewBookRecommend()
},
methods: {
getNewBookRecommend() {
const params = {
libcode: this.libcode,
pageNo: 1,
pageSize: 100
}
FetchNewBookRecommend(params).then(res => {
if (res.errCode === 0) {
let data = []
data = res.data.newbookList
data.forEach(item => {
this.getCoverByISBN(item.isbn.replace(/\-/g, ''), item)
})
} else {
this.$message.error('接口错误')
}
})
},
getCoverByISBN(isbn, item) {
const params = {
isbn: isbn
}
FetchCoverByISBN(params).then((res) => {
console.log(res)
// item.cover = window.URL.createObjectURL(res)
if (res) {
// item.cover = window.URL.createObjectURL(res)
item.cover = res
} else {
item.cover = ''
}
this.rankingList.push(item)
})
}
}
}
</script>
<style lang="scss">
@import "~@/assets/styles/index.scss";
// .screen-main .lending-ranking .module-content{
// padding: 0 .25rem !important;
// }
.swiper-container{
overflow: hidden;
}
.swiper {
width: 100%;
height: 6rem !important;
margin: .4rem 0;
overflow: hidden;
&.gallery-thumbs .swiper-slide {
width: calc(100% / 3);
height: 2.8rem !important;
// padding: .1rem 0 0 0;
margin-top: 0.1rem;
margin-bottom: 0.1rem;
}
// &.gallery-thumbs .swiper-slide-active {
// // background-color: #09194B;
// }
}
.newbook-list-item{
.book-img{
width: 1.325rem;
height: 1.775rem;
background: url('~@/assets/images/default-img.png') no-repeat center center;
background-size: contain;
display: flex;
align-items: center;
overflow: hidden;
margin: 0 auto 0.25rem auto;
img{
display: block;
width: 100%;
// height: 100%;
}
}
.book-info{
h4{
font-size: 0.25rem;
line-height: .3rem;
font-weight: normal;
}
p{
font-size: 0.2rem;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style>

769
src/views/newBookRecommend/index.vue

@ -3,31 +3,33 @@
<div class="screen-item lending-ranking">
<div class="common-title">图书推荐</div>
<div ref="newbook" class="big-module module-content">
<swiper v-if="rankingList.length > 1" ref="swiperThumbs" class="swiper gallery-thumbs directive" :options="swiperOptionThumbs">
<swiper-slide v-for="(item,index) in rankingList" :key="index" class="slide-1">
<div class="newbook-list-item">
<!-- 按6个一组拆分后渲染每组是一屏3列2行 -->
<swiper v-if="groupedList.length > 0" ref="swiperThumbs" class="swiper gallery-thumbs directive" :options="swiperOptionThumbs">
<swiper-slide v-for="(group, groupIndex) in groupedList" :key="groupIndex" class="screen-group">
<!-- 每组内部3列2行布局 -->
<div class="book-grid">
<div v-for="(item) in group" :key="item.nbId" class="newbook-list-item">
<div class="book-img">
<img :src="item.cover" :onerror="defaultImg">
<img :src="item.cover" :onerror="defaultImg" alt="图书封面">
</div>
<div class="book-info">
<h4 class="title-item">{{ item.nbName }}</h4>
<p>{{ item.nbAuthor }}</p>
<p class="author-item">{{ item.nbAuthor }}</p>
</div>
</div>
<!-- 补全空卡片保证每组都是6个布局整齐 -->
<div v-for="empty in 6 - group.length" :key="`empty-${groupIndex}-${empty}`" class="newbook-list-item empty-card">
<div class="book-img" />
<div class="book-info" />
</div>
<!-- <div class="ranking-num">
<svg v-if="index === 0" class="icon" aria-hidden="true">
<use xlink:href="#icon-a-no1" />
</svg>
<svg v-if="index === 1" class="icon" aria-hidden="true">
<use xlink:href="#icon-a-no21" />
</svg>
<svg v-if="index === 2" class="icon" aria-hidden="true">
<use xlink:href="#icon-a-no3" />
</svg>
<p>NO.{{ index+1 }}</p>
</div> -->
</div>
</swiper-slide>
</swiper>
<!-- 数据不足兜底 -->
<div v-else class="empty-tip">
暂无推荐图书
</div>
</div>
</div>
</template>
@ -36,136 +38,725 @@
import { FetchNewBookRecommend, FetchCoverByISBN } from '@/api/library'
import { swiper, swiperSlide } from 'vue-awesome-swiper'
import 'swiper/dist/css/swiper.css'
// import data from './data.json'
export default {
name: 'NewBookRecommend',
components: {
swiper,
swiperSlide
},
components: { swiper, swiperSlide },
data() {
return {
defaultImg: 'this.src="' + require('@/assets/images/default-img.png') + '"',
rankingList: [],
swiperOptionThumbs: {
loopedSlides: 6,
direction: 'vertical',
slidesPerView: 6,
slidesPerGroup: 6,
slidesPerColumn: 2,
autoplay: true
// centeredSlides: true,
// autoScrollOffset: true
}
rankingList: []
}
},
computed: {
swiper() {
return this.$refs.swiperThumbs.swiper
// 6Swiperbug
groupedList() {
const list = [...this.rankingList]
const groups = []
// 6
for (let i = 0; i < list.length; i += 6) {
const group = list.slice(i, i + 6)
groups.push(group)
}
return groups
},
created() {
// Swiper11
swiperOptionThumbs() {
return {
direction: 'vertical',
slidesPerView: 1,
slidesPerGroup: 1,
spaceBetween: 0, // 0
height: 540, //
loop: false,
autoplay: true,
observer: true,
observeParents: true,
autoHeight: false, //
roundLengths: true, //
preventClicks: false, //
//
freeMode: false,
freeModeMomentum: false,
//
slidesOffsetBefore: 0,
slidesOffsetAfter: 0
}
},
swiper() {
return this.$refs.swiperThumbs?.swiper
}
},
mounted() {
// this.rankingList = data
this.getNewBookRecommend()
},
methods: {
getNewBookRecommend() {
async getNewBookRecommend() {
try {
const params = {
libcode: this.libcode,
pageNo: 1,
pageSize: 100
}
FetchNewBookRecommend(params).then(res => {
console.log('params', params)
const res = await FetchNewBookRecommend(params)
// const res = {
// 'errCode': 0,
// 'errMsg': 'ok',
// 'data': {
// 'newbookList': [
// {
// 'nbId': '2c96809799e5c33c019b073b5daf04f4',
// 'libcode': '1201',
// 'nbName': '1',
// 'nbExplain': '\r\n',
// 'createTime': null,
// 'creater': null,
// 'updateTime': '2025-12-10T08:27:33.313+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'B821-49/1793',
// 'isbn': '978-7-5596-7891-1',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b073e896d04f6',
// 'libcode': '1201',
// 'nbName': '',
// 'nbExplain': '西西广西耀\r\n',
// 'createTime': null,
// 'creater': null,
// 'updateTime': '2025-12-10T08:26:54.420+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'J12/13',
// 'isbn': '978-7-5020-9795-0',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b073fa8b404f7',
// 'libcode': '1201',
// 'nbName': '',
// 'nbExplain': '\r\n',
// 'createTime': null,
// 'creater': null,
// 'updateTime': '2025-12-10T08:26:08.467+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'F830.59/232',
// 'isbn': '978-7-5236-0600-1',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b0752c2b70508',
// 'libcode': '1201',
// 'nbName': '',
// 'nbExplain': '1697仿\r\n',
// 'createTime': null,
// 'creater': null,
// 'updateTime': '2025-12-10T08:21:33.923+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '()·(Rudyard Kipling)',
// 'nbBooktype': '',
// 'sortmark': 'I561.84/456',
// 'isbn': '978-7-5327-9277-1',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b075255670507',
// 'libcode': '1201',
// 'nbName': '',
// 'nbExplain': '广\r\n',
// 'createTime': '2025-12-10T08:13:14.983+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T08:13:14.983+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'I287.45/2970',
// 'isbn': '978-7-5702-2851-5',
// 'nbPublisher': '',
// 'nbPublisherdate': '2022',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b0751d1b50506',
// 'libcode': '1201',
// 'nbName': '',
// 'nbExplain': '80\r\n',
// 'createTime': '2025-12-10T08:12:41.270+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T08:12:41.270+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'K928.42-49/7',
// 'isbn': ' 978-7-5417-7604-5',
// 'nbPublisher': '',
// 'nbPublisherdate': '2023',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b0750f3290504',
// 'libcode': '1201',
// 'nbName': '',
// 'nbExplain': '1亿\r\n',
// 'createTime': '2025-12-10T08:11:44.297+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T08:11:44.297+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': ')·(Johan Egerkrans) ',
// 'nbBooktype': '',
// 'sortmark': 'Q915.864-49/89',
// 'isbn': '978-7-02-018036-3',
// 'nbPublisher': '',
// 'nbPublisherdate': '2023',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b074ef9520502',
// 'libcode': '1201',
// 'nbName': '500',
// 'nbExplain': '500穿便\r\n',
// 'createTime': '2025-12-10T08:09:34.803+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T08:09:34.803+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'Z228.1/733:6',
// 'isbn': '978-7-5736-1739-2',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b074c2f140501',
// 'libcode': '1201',
// 'nbName': '',
// 'nbExplain': '1-3\r\n',
// 'createTime': null,
// 'creater': null,
// 'updateTime': '2025-12-10T08:08:36.597+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'I287.45/3092:4',
// 'isbn': '978-7-5337-8997-8',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b074a79540500',
// 'libcode': '1201',
// 'nbName': '100',
// 'nbExplain': '1007-11\r\n',
// 'createTime': null,
// 'creater': null,
// 'updateTime': '2025-12-10T08:05:35.893+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'I287.5/1296:11',
// 'isbn': '978-7-5148-8625-2',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b0748f73104ff',
// 'libcode': '1201',
// 'nbName': '',
// 'nbExplain': '\r\n',
// 'createTime': null,
// 'creater': null,
// 'updateTime': '2025-12-10T08:04:07.553+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'K204.1/22:4',
// 'isbn': '978-7-5139-4167-9',
// 'nbPublisher': '',
// 'nbPublisherdate': '2023',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b0747d96004fe',
// 'libcode': '1201',
// 'nbName': '沿',
// 'nbExplain': '\r\n',
// 'createTime': '2025-12-10T08:01:47.873+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T08:01:47.873+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'G127.2/3',
// 'isbn': '978-7-5474-4916-5',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b07472c3304fd',
// 'libcode': '1201',
// 'nbName': '100+',
// 'nbExplain': '沿24沿沿\r\n',
// 'createTime': '2025-12-10T08:01:03.537+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T08:01:03.537+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'Z271.2/12:1',
// 'isbn': '978-7-5583-3621-8',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b0744957004fc',
// 'libcode': '1201',
// 'nbName': 'everyday health hacks to worry less and live better',
// 'nbExplain': '\r\n',
// 'createTime': '2025-12-10T07:58:13.870+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T07:58:13.870+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '()·(Karan Rajan) , ',
// 'nbBooktype': '',
// 'sortmark': 'R161/239',
// 'isbn': '978-7-5217-6957-9 ',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b0742943604fb',
// 'libcode': '1201',
// 'nbName': '',
// 'nbExplain': '\r\n',
// 'createTime': '2025-12-10T07:56:02.487+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T07:56:02.487+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'C912.6-0/24',
// 'isbn': '978-7-5596-7508-8?',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b0741c9fe04fa',
// 'libcode': '1201',
// 'nbName': '',
// 'nbExplain': ', , , 广, 广\r\n',
// 'createTime': '2025-12-10T07:55:10.717+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T07:55:10.717+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'R212/191',
// 'isbn': '978-7-5551-2386-6',
// 'nbPublisher': '广西',
// 'nbPublisherdate': '2025',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b0741474204f9',
// 'libcode': '1201',
// 'nbName': '22',
// 'nbExplain': '@\r\n',
// 'createTime': '2025-12-10T07:54:37.250+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T07:54:37.250+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'F713.365.2/315',
// 'isbn': '978-7-5521-2482-8',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b074047f604f8',
// 'libcode': '1201',
// 'nbName': '',
// 'nbExplain': '23000\r\n',
// 'createTime': '2025-12-10T07:53:31.893+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T07:53:31.893+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': ' , ',
// 'nbBooktype': '',
// 'sortmark': 'H319.4:I/540',
// 'isbn': '978-7-5702-3295-6',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b073c8e2804f5',
// 'libcode': '1201',
// 'nbName': '',
// 'nbExplain': '\r\n',
// 'createTime': '2025-12-10T07:49:27.720+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T07:49:27.720+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'F0-49/197',
// 'isbn': '978-7-5229-1345-2',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b073ad6bd04f3',
// 'libcode': '1201',
// 'nbName': '111',
// 'nbExplain': '\r\n',
// 'createTime': '2025-12-10T07:47:35.230+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T07:47:35.230+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'I247.57/6741',
// 'isbn': '978-7-5339-7651-4',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b073ad6bd04f3',
// 'libcode': '1201',
// 'nbName': '111',
// 'nbExplain': '\r\n',
// 'createTime': '2025-12-10T07:47:35.230+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T07:47:35.230+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'I247.57/6741',
// 'isbn': '978-7-5339-7651-4',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b073ad6bd04f3',
// 'libcode': '1201',
// 'nbName': '111',
// 'nbExplain': '\r\n',
// 'createTime': '2025-12-10T07:47:35.230+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T07:47:35.230+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'I247.57/6741',
// 'isbn': '978-7-5339-7651-4',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b073ad6bd04f3',
// 'libcode': '1201',
// 'nbName': '111',
// 'nbExplain': '\r\n',
// 'createTime': '2025-12-10T07:47:35.230+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T07:47:35.230+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'I247.57/6741',
// 'isbn': '978-7-5339-7651-4',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b073ad6bd04f3',
// 'libcode': '1201',
// 'nbName': '111',
// 'nbExplain': '\r\n',
// 'createTime': '2025-12-10T07:47:35.230+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T07:47:35.230+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'I247.57/6741',
// 'isbn': '978-7-5339-7651-4',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b073ad6bd04f3',
// 'libcode': '1201',
// 'nbName': '111',
// 'nbExplain': '\r\n',
// 'createTime': '2025-12-10T07:47:35.230+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T07:47:35.230+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'I247.57/6741',
// 'isbn': '978-7-5339-7651-4',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b073ad6bd04f3',
// 'libcode': '1201',
// 'nbName': '111',
// 'nbExplain': '\r\n',
// 'createTime': '2025-12-10T07:47:35.230+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T07:47:35.230+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'I247.57/6741',
// 'isbn': '978-7-5339-7651-4',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// },
// {
// 'nbId': '2c96809799e5c33c019b073ad6bd04f3',
// 'libcode': '1201',
// 'nbName': '111',
// 'nbExplain': '\r\n',
// 'createTime': '2025-12-10T07:47:35.230+0000',
// 'creater': '297edff88354751d018359cd2e120000',
// 'updateTime': '2025-12-10T07:47:35.230+0000',
// 'updater': '297edff88354751d018359cd2e120000',
// 'nbAuthor': '',
// 'nbBooktype': '',
// 'sortmark': 'I247.57/6741',
// 'isbn': '978-7-5339-7651-4',
// 'nbPublisher': '',
// 'nbPublisherdate': '2024',
// 'nbRecno': '',
// 'nbImgPath': ''
// }
// ],
// 'page': {
// 'totalRows': 20,
// 'pageSize': 100,
// 'currentPage': 1,
// 'totalPages': 1,
// 'startRow': 0
// }
// }
// }
if (res.errCode === 0) {
let data = []
data = res.data.newbookList
data.forEach(item => {
this.getCoverByISBN(item.isbn.replace(/\-/g, ''), item)
const bookList = res.data.newbookList
const bookWithCovers = await Promise.all(
bookList.map(async(item) => {
const isbn = item.isbn.replace(/\-/g, '').trim()
try {
const coverRes = await FetchCoverByISBN({ isbn })
return { ...item, cover: coverRes || '' }
} catch (e) {
console.error(`获取ISBN:${isbn}封面失败`, e)
return { ...item, cover: '' }
}
})
} else {
this.$message.error('接口错误')
)
// 20
this.rankingList = bookWithCovers
// swiper
this.$nextTick(() => {
if (this.swiper) {
this.swiper.update()
}
})
},
getCoverByISBN(isbn, item) {
const params = {
isbn: isbn
}
FetchCoverByISBN(params).then((res) => {
console.log(res)
// item.cover = window.URL.createObjectURL(res)
if (res) {
// item.cover = window.URL.createObjectURL(res)
item.cover = res
} else {
item.cover = ''
this.$message.error('获取推荐图书失败:' + res.errMsg)
}
} catch (error) {
console.error('接口请求异常', error)
this.$message.error('接口请求异常')
}
this.rankingList.push(item)
})
}
}
}
</script>
<style lang="scss">
<style lang="scss" scoped>
@import "~@/assets/styles/index.scss";
// .screen-main .lending-ranking .module-content{
// padding: 0 .25rem !important;
// }
.swiper-container{
//
.big-module {
box-sizing: border-box; //
overflow: hidden;
position: relative;
padding: 0; // padding
margin: 0; // margin
height: 520px;
}
// Swiper
.swiper {
width: 100%;
height: 6rem !important;
margin: .4rem 0;
width: 100% !important;
height: 100% !important;
box-sizing: border-box;
padding: 0 !important;
margin: 0 !important;
overflow: hidden !important;
position: relative !important;
}
//
.swiper-slide.screen-group {
width: 100% !important;
height: 100% !important;
padding: 0 !important;
margin: 0 !important;
box-sizing: border-box !important;
// position: absolute !important; //
// top: 0 !important; //
// left: 0 !important;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden !important;
}
// 32
.book-grid {
width: calc(100% - 20px); // 10pxcalc
height: calc(100% - 20px); // 10px
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(2, 1fr);
gap: 10px; // gappadding
box-sizing: border-box;
padding: 0 !important;
margin: 0 !important;
overflow: hidden;
&.gallery-thumbs .swiper-slide {
width: calc(100% / 3);
height: 2.8rem !important;
// padding: .1rem 0 0 0;
margin-top: 0.1rem;
margin-bottom: 0.1rem;
}
// &.gallery-thumbs .swiper-slide-active {
// // background-color: #09194B;
// }
}
.newbook-list-item{
.book-img{
//
.newbook-list-item {
box-sizing: border-box;
padding: 0;
margin: 0;
width: 100%;
height: 100%; //
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
&.empty-card {
visibility: hidden;
}
.book-img {
width: 1.325rem;
height: 1.775rem;
margin: 0 auto 0.25rem;
padding: 0;
background: url('~@/assets/images/default-img.png') no-repeat center center;
background-size: contain;
display: flex;
align-items: center;
overflow: hidden;
margin: 0 auto 0.25rem auto;
img{
display: block;
img {
width: 100%;
// height: 100%;
height: 100%;
object-fit: cover;
}
}
.book-info{
h4{
.book-info {
width: 1.82rem;
padding: 0;
margin: 0 auto;
.title-item {
font-size: 0.25rem;
line-height: .3rem;
font-weight: normal;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}
p{
.author-item {
font-size: 0.2rem;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
line-height: 14px;
}
}
}
//
.empty-tip {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
font-size: 0.25rem;
color: #ccc;
box-sizing: border-box;
}
</style>
Loading…
Cancel
Save