From 4beb13cccb7b37aad5dddbea9fbb3ac185b9fde7 Mon Sep 17 00:00:00 2001
From: "@fawn-nine" <1271023382@qq.com>
Date: Fri, 22 Sep 2023 11:34:09 +0800
Subject: [PATCH] .

---
 pages/listen/home.vue | 445 +++++++++++++++++++++++-------------------
 1 file changed, 243 insertions(+), 202 deletions(-)

diff --git a/pages/listen/home.vue b/pages/listen/home.vue
index ae645a1..ab87def 100644
--- a/pages/listen/home.vue
+++ b/pages/listen/home.vue
@@ -1,9 +1,9 @@
 <template>
 	<view>
 		<!-- 公共组件-每个页面必须引入 -->
-		<public-module></public-module>		
+		<public-module></public-module>
 		<z-nav-bar title="我的听书"></z-nav-bar>
-		<view class="home_bg" >
+		<view class="home_bg">
 			<image src="../../static/icon/home_icon_1.png" mode="aspectFit" class="icon_hua_1"></image>
 			<view v-if="showEbook" class="search_box" @click="onPageJump('./searchFor')">
 				<text class="icon_search"></text>
@@ -11,34 +11,40 @@
 			</view>
 		</view>
 		<view class="contentButton">
-			<u-tabs :scrollable="false" bg-color="#d4d4d4" active-color="#2979ff" inactive-color="#606266" bar-height="10" :list="contentButtonList" @click="contentButtonClick" lineWidth="42" :inactiveStyle="{fontSize:'32rpx'}" :activeStyle="{color: '#303133',fontWeight: 'bold', transform: 'scale(1.01)'}"></u-tabs>
+			<u-tabs :scrollable="false" bg-color="#d4d4d4" active-color="#2979ff" inactive-color="#606266"
+				bar-height="10" :list="contentButtonList" @click="contentButtonClick" lineWidth="42"
+				:inactiveStyle="{fontSize:'32rpx'}"
+				:activeStyle="{color: '#303133',fontWeight: 'bold', transform: 'scale(1.01)'}"></u-tabs>
 		</view>
 		<view class="listenList" v-if="bookList.length > 0 || tjBookLIst.length > 0">
-			<view class="wrap" v-if="contentShow == 0">				 
-					<u-row gutter="16" justify="flex-start" v-if="bookList.length > 0">
-						<u-col span="4" v-for="(item,index) in bookList" :key="index">
-							<view>
+			<view class="wrap" v-if="contentShow == 0">
+				<u-row gutter="16" justify="flex-start" v-if="bookList.length > 0">
+					<u-col span="4" v-for="(item,index) in bookList" :key="index">
+						<view>
 							<view class="videoBox demo-layout bg-purple" @click="goToListenFree(item)">
-								<image v-if="item.image != ''" :src="item.image" mode="scaleToFill" ></image>
-								<image v-else src="../../static/icon/wufeng.jpg" mode="scaleToFill" ></image>
+								<image v-if="item.image != ''" :src="item.image" mode="scaleToFill"></image>
+								<image v-else src="../../static/icon/wufeng.jpg" mode="scaleToFill"></image>
 								<!-- <u-icon class="playButton" name="play-circle" color="#54a966" size="40"></u-icon> -->
 							</view>
-							<text class="bookName">{{item.bookName}}</text>							
-							</view>
-						</u-col>						
-					</u-row>	
-					<u-divider v-else text="暂无已购买书籍~"></u-divider>				
-				</view>	
-				
-				<view class="wrap" v-if="contentShow == 1">					
-						<u-row gutter="16" justify="flex-start" v-if="tjBookLIst.length > 0">
-							<u-col span="4"  v-for="(item,index) in tjBookLIst" :key="index">
-								<view class="videoBox demo-layout bg-purple" @click="goDetail(item.product)">
-									<image :src="item.product.productImages" mode="scaleToFill" ></image>
-									<!-- <u-icon class="playButton" name="play-circle" color="#54a966" size="40"></u-icon> -->
-								</view>
-								<text class="bookName">{{item.product.productName}}</text>
-								<!-- <view class="btns flexbox">
+							<text class="bookName">{{item.bookName}}</text>
+						</view>
+					</u-col>
+				</u-row>
+				<u-divider v-else text="暂无已购买书籍~"></u-divider>
+			</view>
+
+			<view class="wrap" v-if="contentShow == 1">
+				<view v-if="1==1">
+					接口正在调试
+				</view>
+				<u-row gutter="16" justify="flex-start" v-if="tjBookLIst.length > 0 && 6==3">
+					<u-col span="4" v-for="(item,index) in tjBookLIst" :key="index">
+						<view class="videoBox demo-layout bg-purple" @click="goDetail(item)">
+							<image :src="item.images" mode="scaleToFill"></image>
+							<!-- <u-icon class="playButton" name="play-circle" color="#54a966" size="40"></u-icon> -->
+						</view>
+						<text class="bookName">{{item.name}}</text>
+						<!-- <view class="btns flexbox">
 									<view class="item flexbox" @click="goToListen(item)">
 										<u-icon name="volume" color="#71d5a1" size="24"></u-icon>
 										<text>听 书</text>
@@ -48,47 +54,47 @@
 										<text>评 书</text>
 									</view>
 								</view> -->
-							</u-col>						
-						</u-row>
-						<u-divider v-else text="暂无推荐书籍~"></u-divider>
-					</view>	
-					
-		</view>
-		<u-divider v-else text="暂无买书籍数据~"></u-divider>	
-		<view>
-			<view v-if="status==0" style="text-align: center;">
-				<u-loading-icon style="display: inline-block;"></u-loading-icon>
-				<font style='vertical-align: super;margin-left: 10px;font-size: 26rpx;color: #909399;'>努力加载中</font>
-			</view>
-			<view v-if="status==1">
-				<u-divider text="全部加载完成"></u-divider>
+					</u-col>
+				</u-row>
+				<u-divider v-else text="暂无推荐书籍~"></u-divider>
+				<view>
+					<view v-if="status==0" style="text-align: center;">
+						<u-loading-icon style="display: inline-block;"></u-loading-icon>
+						<font style='vertical-align: super;margin-left: 10px;font-size: 26rpx;color: #909399;'>努力加载中</font>
+					</view>
+					<view v-if="status==1">
+						<u-divider text="全部加载完成"></u-divider>
+					</view>
+				</view>
 			</view>
+
 		</view>
-		
+		<u-divider v-else text="暂无买书籍数据~"></u-divider>		
+
 		<music-play :playData="playData"></music-play>
 		<!-- <z-navigation></z-navigation> -->
 	</view>
 </template>
 
 <script>
-	 import musicPlay from '@/components/music.vue'
+	import musicPlay from '@/components/music.vue'
 	import {
 		mapState
 	} from 'vuex';
 	export default {
 		data() {
 			return {
-				showEbook:false,
-				playData:{},
-				loadingNow : false,
-				bookList:[],
-				contentShow:0,
-				page:1, // 页码
+				showEbook: false,
+				playData: {},
+				loadingNow: false,
+				bookList: [],
+				contentShow: 0,
+				page: 1, // 页码
 				status: 3,
-				ygtotalPage:1,
-				tjPage:1,
-				tjTotalPage:1,
-				tjBookLIst:[],
+				ygtotalPage: 1,
+				tjPage: 1,
+				tjTotalPage: 1,
+				tjBookLIst: [],
 				contentButtonList: [{
 						name: '已购图书'
 					},
@@ -98,28 +104,29 @@
 				],
 			}
 		},
-		onLoad() {
+		onLoad() {			
+		},
+		onShow() {
 			this.getListDate()
 			this.getfreeBook()
 		},
 		onPullDownRefresh() {
 			console.log('下拉刷新了')
-			uni.stopPullDownRefresh(); 
-			   if(this.contentShow == 0){
-				  // this.page=1, // 页码			   
-				   this.bookList = []
-				   this.getfreeBook()
-			   }
-			   else if(this.contentShow == 1){
-			   //	this.tjPage=1, // 页码
-			   	this.tjBookLIst = []
-			   	this.getListDate()
-			   }
+			uni.stopPullDownRefresh();
+			if (this.contentShow == 0) {
+				// this.page=1, // 页码			   
+				this.bookList = []
+				this.getfreeBook()
+			} else if (this.contentShow == 1) {
+				//	this.tjPage=1, // 页码
+				this.tjBookLIst = []
+				this.getListDate()
+			}
 		},
 		onReachBottom() {
 			this.loadingNow = true
 			console.log('到底了')
-			
+
 			// if(this.contentShow == 0){	
 			// 	//console.log(this.page , this.ygtotalPage)
 			// 	if(this.page < this.ygtotalPage){	
@@ -127,178 +134,161 @@
 			// 		console.log('加载',this.page)
 			// 		this.status = 0
 			// 		this.getfreeBook()
-					
+
 			// 	}else{
 			// 		this.status = 1
 			// 		console.log('加载完成了',this.page)
 			// 		return
 			// 	}
-				
+
 			// }
-			
-			 if(this.contentShow == 1){				
-				if(this.tjPage < this.tjTotalPage){
+
+			if (this.contentShow == 1) {
+				if (this.tjPage < this.tjTotalPage) {
 					this.tjPage++
-					console.log('加载',this.tjPage)
+					console.log('加载', this.tjPage)
 					this.status = 0
 					this.getListDate()
-					
-				}else{
+
+				} else {
 					this.status = 1
-					console.log('加载完成了',this.tjPage)
+					console.log('加载完成了', this.tjPage)
 					return
 				}
 			}
 		},
-		components:{
+		components: {
 			musicPlay
 		},
 		computed: {
 			...mapState(['userInfo'])
 		},
-		methods: {	
+		methods: {
 			// 未购买图书，评书跳转
-			wgGoPingshu(item){
-				console.log('未购买评书',item)
-				if(item.bookId == null || item.bookId.length <= 0){
+			wgGoPingshu(item) {
+				console.log('未购买评书', item)
+				if (item.bookId == null || item.bookId.length <= 0) {
 					//uni.showModal()
 					uni.showModal({
 						title: '提示',
-						showCancel:false,
+						showCancel: false,
 						content: '当前未关联图书信息，请联系联系管理员',
-						success: function (res) {
+						success: function(res) {
 							if (res.confirm) {
 								console.log('好的');
-							} 
+							}
 						}
 					});
-				}else{
+				} else {
 					uni.navigateTo({
-						 url: '../comments/comments?bookid='+item.bookId[0],
+						url: '../comments/comments?bookid=' + item.bookId[0],
 						// url:'../bookShop/commodityDetail'
-						
+
 					});
 				}
 			},
 			// 跳转到评书
-			goPingshu(val){
-				console.log('评书',val)
+			goPingshu(val) {
+				console.log('评书', val)
 				uni.navigateTo({
-					 url: '../comments/comments?bookid='+val,
+					url: '../comments/comments?bookid=' + val,
 					// url:'../bookShop/commodityDetail'
-					
+
 				});
-			},			
-			contentButtonClick(e){
+			},
+			contentButtonClick(e) {
 				this.contentShow = e.index
 			},
 			// 获取已购买书籍
-			getfreeBook(){
+			getfreeBook() {
 				this.$http
 					.post('book/userebookbuy/buylist', {
-					// .post('book/buyorderdetail/querybuy', {
+						// .post('book/buyorderdetail/querybuy', {
 						'id': this.userInfo.id,
-						'page':this.page,
-						'limit':9
+						'page': this.page,
+						'limit': 9
 					})
 					.then(res => {
-						
-						if(res.code == 0){
+
+						if (res.code == 0) {
 							// this.ygtotalPage = res.page.totalPage
-							
+
 							res.page.forEach(item => {
-								if(item.canListen){
+								if (item.canListen) {
 									this.bookList.push(item)
 								}
 							})
-						//	this.bookList =  = this.bookList.concat(res.page.list)
-							 console.log(res,'已购买')
+							//	this.bookList =  = this.bookList.concat(res.page.list)
+							console.log(res, '已购买')
 							this.status = 3
-						}					
-						
+						}
+
 					});
 			},
-			
+
 			// 获取推荐图书（未购买）
-			getListDate(){
-				this.loadingNow = false
-				// 获取书架列表
+			getListDate() {
+				this.loadingNow = false				
 				this.$http
-					.post('book/shopproduct/booklist', {
+					.post('book/book/getUserNobuyBooks', { // 磊哥新写
+						// .post('book/shopproduct/booklist', { // 原接口
 						'userId': this.userInfo.id,
-						// 'limit':9,
-						// 'page':this.tjPage
+						'limit': 9,
+						'page': this.tjPage
 					})
 					.then(res => {
 						console.log(res)
-						if(res.code == 0){
-							// this.tjTotalPage = res.pages.totalPage
-							var arr = []
-							if(res.pages.length > 0){
-							// 	for (var i=0; i<res.pages.length; i++ ) {
-							// 		var booidArr = []
-							// 		if(res.pages[i].product.bookId != null){
-							// 			booidArr = res.pages[i].product.bookId.split(',')
-							// 			res.pages[i].product.bookId = booidArr
-							// 		}else{
-							// 			res.pages[i].product.bookId = []
-							// 		}
-							// }
-							
-							// res.pages.list.map((item) => {																		
-							// 		var ids = item.bookId.split(",")									
-							// 		item.bookId = ids									
-							// 		console.log(ids)
-							// 		console.log(item,666)
-							// 	    arr.push(item)
-							// 		console.log(arr,888)
-							// 	})
-							//	console.log(arr,444)
-							// }else{
-							// 	arr = []
-							// }
-							// console.log(res.pages.list,'res.pages.list')
-							this.tjBookLIst = res.pages
-							// var arr = res.pages.list							
-							// this.tjBookLIst = this.tjBookLIst.concat(res.pages)
-							 console.log(this.tjBookLIst[0].product,'this.tjBookLIst')
-							 
+						if (res.code == 0 && res.books.length > 0) {							
+							console.log(res,'推荐听书列表')							
+							this.tjBookLIst = res.books
+							var yu = res.count % 9
+							if(yu != 0){
+								this.tjTotalPage = parseInt(res.count / 9) + 1
+							}else{
+								this.tjTotalPage = parseInt(res.count / 9)
+							}
+							console.log(this.tjTotalPage,'tjTotalPage')							
 							this.status = 3
-						}	}			
-						
+						}else{							
+							this.tjTotalPage = 0
+							this.status = 3
+						}
+
+					}).catch(e => {
+						console.log(e,'e')
 					});
 			},
 			// 跳转详情页
 			goDetail(item) {
-				console.log(item,'goDetail-----')
+				console.log(item, 'goDetail-----')
 				uni.navigateTo({
 					url: '../bookShop/commodityDetail?id=' + item.productId
 				});
 			},
-			goToListen(item){				
-				if(item.bookId == null || item.bookId.length <= 0){
+			goToListen(item) {
+				if (item.bookId == null || item.bookId.length <= 0) {
 					//uni.showModal()
 					uni.showModal({
 						title: '提示',
-						showCancel:false,
+						showCancel: false,
 						content: '当前图书暂不支持试听',
-						success: function (res) {
+						success: function(res) {
 							if (res.confirm) {
 								console.log('好的');
-							} 
+							}
 						}
 					});
-				}else{
-					uni.navigateTo({						
-						 url: "./listen?bookid="+item.bookId[0]						
+				} else {
+					uni.navigateTo({
+						url: "./listen?bookid=" + item.bookId[0]
 					});
-				}				
+				}
 			},
 			// 跳转到听书详情
-			goToListenFree(item){
+			goToListenFree(item) {
 				uni.navigateTo({
 					// url: "./musicbg?bookid="+item.bookid+"&fengImg="+item.image    // 后台播放版本
-					 url: "./listen?bookid="+item.bookId+"&fengImg="+item.image   // 前台播放版本
+					url: "./listen?bookid=" + item.bookId + "&fengImg=" + item.image // 前台播放版本
 					// url: "./bgMusix"
 				});
 			},
@@ -314,55 +304,105 @@
 
 <style lang="scss" scoped>
 	@import '@/style/mixin.scss';
-	.contentButton{margin: 20rpx 0;}
-	.btns{margin-top: 15rpx; background-color: #f1f1f1; border-radius: 10rpx; font-size: 28rpx; justify-content: space-between;
-		
+
+	.contentButton {
+		margin: 20rpx 0;
 	}
-	.quesheng{text-align: center; margin-top: 100rpx; color: #8b8a91;}
-	.bookName{		
-		white-space: nowrap;					
+
+	.btns {
+		margin-top: 15rpx;
+		background-color: #f1f1f1;
+		border-radius: 10rpx;
+		font-size: 28rpx;
+		justify-content: space-between;
+
+	}
+
+	.quesheng {
+		text-align: center;
+		margin-top: 100rpx;
+		color: #8b8a91;
+	}
+
+	.bookName {
+		white-space: nowrap;
 		overflow-x: hidden;
 		text-overflow: ellipsis;
-				font-size: 30rpx; color: #333; padding: 10rpx 0;
+		font-size: 30rpx;
+		color: #333;
+		padding: 10rpx 0;
 	}
-	.videoBox{position: relative;
-		image{height: 290rpx;}
+
+	.videoBox {
+		position: relative;
+
+		image {
+			height: 290rpx;
+		}
 	}
-	
-	.playButton{position: absolute; z-index: 1; right: 4px; bottom: 4px;  padding: 5px; border-radius: 100%;  }
+
+	.playButton {
+		position: absolute;
+		z-index: 1;
+		right: 4px;
+		bottom: 4px;
+		padding: 5px;
+		border-radius: 100%;
+	}
+
 	uni-image {
-	    width:auto !important;
-	    height: 350rpx;
+		width: auto !important;
+		height: 350rpx;
 	}
-	.u-row{flex-wrap: wrap;}
-	.u-col{overflow: hidden;  margin-bottom:20rpx; }
-	.listenList{padding: 10rpx; box-sizing: border-box; width: calc(100% - 10rpx);}
-	.flexbox{display: flex;}
+
+	.u-row {
+		flex-wrap: wrap;
+	}
+
+	.u-col {
+		overflow: hidden;
+		margin-bottom: 20rpx;
+	}
+
+	.listenList {
+		padding: 10rpx;
+		box-sizing: border-box;
+		width: calc(100% - 10rpx);
+	}
+
+	.flexbox {
+		display: flex;
+	}
+
 	.scroll-Y {
-			height: 300rpx;
-		}
-		.scroll-view_H {
-			white-space: nowrap;
-			width: 100%;
-		}
-		.scroll-view-item {
-			height: 300rpx;
-			line-height: 300rpx;
-			text-align: center;
-			font-size: 36rpx;
-		}
-		.scroll-view-item_H {
-			display: inline-block;
-			width: 60%;
-			height: 300rpx;
-			line-height: 300rpx;
-			text-align: center;
-			font-size: 36rpx;
-		}
+		height: 300rpx;
+	}
+
+	.scroll-view_H {
+		white-space: nowrap;
+		width: 100%;
+	}
+
+	.scroll-view-item {
+		height: 300rpx;
+		line-height: 300rpx;
+		text-align: center;
+		font-size: 36rpx;
+	}
+
+	.scroll-view-item_H {
+		display: inline-block;
+		width: 60%;
+		height: 300rpx;
+		line-height: 300rpx;
+		text-align: center;
+		font-size: 36rpx;
+	}
+
 	.head_line {
 		margin: 50rpx 0;
-	
-	
+
+
 		b {
 			display: inline-block;
 			width: 12rpx;
@@ -371,12 +411,12 @@
 			vertical-align: bottom;
 			margin: 0 20rpx 0 0;
 		}
-	
+
 		text {
 			font-size: 32rpx;
 			font-weight: bold;
 		}
-	
+
 		i {
 			float: right;
 			font-style: normal;
@@ -385,6 +425,7 @@
 			margin: 5rpx 35rpx 0 0;
 		}
 	}
+
 	.home_bg {
 		background-image: url('@/static/icon/home_bg.jpg');
 		background-position: center center;
@@ -392,13 +433,13 @@
 		background-size: cover;
 		padding: 100rpx 0 40rpx 0;
 		position: relative;
-	
+
 		.icon_hua_1 {
 			margin: 0 auto;
 			width: 150rpx;
 			height: 150rpx;
 		}
-	
+
 		.search_box {
 			width: 90%;
 			height: 64upx;
@@ -412,12 +453,12 @@
 			left: 50%;
 			bottom: -30rpx;
 			box-shadow: 0 0px 10px 1px #54a96633;
-	
+
 			.prompt {
 				color: #cccccc;
-	
+
 			}
-	
+
 			.icon_search {
 				background-image: url('@/static/icon/map_ic_search.png');
 				background-position: center center;
@@ -429,4 +470,4 @@
 			}
 		}
 	}
-</style>
+</style>
\ No newline at end of file