0317

2023-03-17 18:12:24 +08:00
parent ffa17b7630
commit 8aabbd6bf5
6 changed files with 201 additions and 72 deletions
--- a/pages/bookShop/settlement.vue
+++ b/pages/bookShop/settlement.vue
@@ -816,8 +816,6 @@
 		.operate {
 			display: flex;

-
-
 			.goBuy {
 				font-size: 32rpx;
 				color: #fff;
--- a/pages/peanut/opeVip.vue
+++ b/pages/peanut/opeVip.vue
@@ -90,7 +90,7 @@
 		<!-- 充值协议 -->
 		<u-popup :show="xieyiShow" :round="10" @close="xieyiShow=false">
 			<view class="tanchu">
-				<view class="dp_title">会员服务协议</view>
+				<view class="dp_title">{{xieyi.title}}</view>
 				<view style="max-height: 1000rpx;overflow-y: scroll;">
 					<view v-html="xieyi.content"></view>
 				</view>				
@@ -345,6 +345,7 @@
 </script>
 <style lang="scss" scoped>
 	@import '@/style/mixin.scss';
+	.highlight{color: $uni-color-primary;}
 	.agreeRadio{ zoom: .8;}
 	.tanchu {
 		padding: 40rpx 30rpx 40rpx 30rpx;
--- a/pages/peanut/reCharge.vue
+++ b/pages/peanut/reCharge.vue
@@ -67,7 +67,7 @@
 		<!-- 充值协议 -->
 		<u-popup :show="xieyiShow" :round="10" @close="xieyiShow=false">
 			<view class="tanchu">
-				<view class="dp_title">增值服务协议</view>
+				<view class="dp_title">{{xieyi.title}}</view>
 				<view style="max-height: 1000rpx;overflow-y: scroll;">
 					<view v-html="xieyi.content"></view>
 				</view>				
--- a/pages/yRead/angbook.vue
+++ b/pages/yRead/angbook.vue
@@ -51,13 +51,15 @@

 		<!-- 垂直翻页 -->
 		<!-- @click="showMenu" -->
-		<view class="vertical" v-if="isVertical">
+		<view class="vertical" v-if="isVerticalHua">
 			<view class="verticalbox" :class="{ container0: background === 1, container1: background === 2 }"
 				@click="showMenu">
 				<!-- 章节名 -->
-				<view class="chapter">{{ verticalData.chapterName }}</view>				
+				<view class="chapter">
+					{{ verticalData.chapterName }}					
+				</view>				
 				<scroll-view :scroll-anchoring="true"  scroll-y="true" :scroll-top="scrollTop" scroll-with-animation="true" style="height: 600px; "
-					@scrolltoupper="scrolltoupper" @scrolltolower="scrolltolower" @scroll="scroll" @touchend="touchEnd" @touchstart="touchStart">
+					@scrolltoupper="scrolltoupper" @scrolltolower="scrolltolower" @scroll="scroll" >
 					<view class="content">						
 						<view class="inner-box" :style="{ height: `${innerHeight}px` }" v-if="verticalData.canRead">
 							<view>
@@ -146,7 +148,9 @@
 					boxShadow: showShadow && turnType === 0 ? '0 0 10px 0 rgba(0,0,0,.4)' : ''
 				}" @touchstart="touchStart" @touchend="touchEnd" @touchmove="touchMove" @touchcancel="touchcancel">
 				<!-- 章节名 -->
-				<view class="chapter">{{ curPage.chapterName }}</view>
+				<view class="chapter">{{ curPage.chapterName }}
+					<uni-icons v-if="newchapterImgList && newchapterImgList.length > 0" id="showImgs" @click="showImgHandle" class="showImgs" type="images" size="20"></uni-icons>
+				</view>
 				<view class="content">
 					<view class="inner-box" :style="{ height: `${innerHeight}px` }" v-if="curPage.canRead">
 						<view class="book-inner" >
@@ -312,14 +316,18 @@
 						<view class="line" :class="{ lineActive: lineHeight === 2 }" v-for="i in 3" :key="i"></view>
 					</view>
 				</view>
-				<view class="item">
-					<view class="item-name">翻页</view>
-					<view class="icon" :class="{ active: turnType === 0 }" style="padding: 5px 8px;"
+				<view class="item" >
+					<view class="item-name" style="display: block; width: 45px;">翻页</view>
+					<view style="display: flex;  flex-grow: 1" class="item_wrap">
+					<view class="icon" :class="{ active: turnType === 0 }" style="padding: 5px 8px; margin-bottom: 6px;"
 						@click="changeTurnType(0)">覆盖</view>
-					<view class="icon" :class="{ active: turnType === 1 }" style="padding: 5px 8px;"
+					<view class="icon" :class="{ active: turnType === 1 }" style="padding: 5px 8px;  margin-bottom: 6px;"
 						@click="changeTurnType(1)">左右平移</view>
-					<!-- <view class="icon" :class="{ active: turnType === 2 }" style="padding: 5px 8px;"
-						@click="changeTurnType(2)">上下平移</view> -->
+					<view class="icon" :class="{ active: turnType === 2 }" style="padding: 5px 8px; margin-bottom: 6px;"
+						@click="changeTurnType(2)">上下平移</view>
+					<view class="icon" :class="{ active: turnType === 3 }" style="padding: 5px 8px; margin-bottom: 6px;"
+						@click="changeTurnType(3)">上下滑动</view>
+					</view>
 				</view>
 				<view class="item">
 					<view class="item-name">背景</view>
@@ -346,6 +354,21 @@
 				</virtual-list>
 			</view>
 		</view>
+		<!-- 图片弹窗 -->
+		<u-popup :show="imgsShow" :round="10" @close="imgsShow=false">
+			<view class="tanchu" v-if="newchapterImgList">
+				<text class="chapterImgTitle">当前章节共 {{newchapterImgList.length}} 张图片</text>
+				<scroll-view class="scroll-view_H" scroll-x="true"  scroll-left="120" @scrolltolower="toRight">
+					<view  v-for="(item,index) in newchapterImgList" class="scroll-view-item_H">
+					<view class="imgBox">						
+						<view style="height:90%" @click="clickImg(newchapterImgList,index)">
+							<img :src="item" alt="" height="100%"></view>							
+						<!-- <text class="nothingShow" v-if="index == newchapterImgList.length-1">已最后一张图片</text> -->
+					</view>					
+					</view>					
+				</scroll-view>				
+			</view>
+		</u-popup>
 	</view>
 </template>

@@ -362,6 +385,8 @@
 	let copyBookText = []	
 	let preText = []
 	let nextText = []
+	let imglist = []
+	
 	// var music = uni.createInnerAudioContext();
 	export default {
 		components: {
@@ -370,6 +395,11 @@
 		},
 		data() {
 			return {
+				imgsShow:false,
+				nothingShow:false,
+				// 本章图片列表
+				chapterImgList:[],
+				newchapterImgList:[],
 				preChapterTotal : null,
 				nextChapterTotal :null,
 				// preBookText = []
@@ -524,7 +554,7 @@
 				lineHeight: '', //行高，注意是fontSize的倍数
 				background: '', //背景
 				colorList: ['#000', '#666'], //与背景对应的字体颜色
-				highlight: "", // 字体高亮
+				highlight: "null", // 字体高亮
 				fhighlight: false, // 左右的高亮
 				chapterProgress: 0, //‘章节进度条’的参数
 				progressTouched: false, //是否正在点击‘章节进度条’
@@ -543,6 +573,7 @@
 					isBuy: 0,
 					isVip: 0,
 				},
+				isVerticalHua:false,
 				speedTrue: false, //判断是否更新进度
 				speedData: {
 					bookId: 0,
@@ -560,6 +591,9 @@
 					width: 0,
 					before: false
 				},
+				topChange:0,
+				scroll_end: false,
+				musicPlaying: false // 正在播放音频
 			}
 		},

@@ -593,15 +627,46 @@
 			},
 			...mapState(['userInfo']),
 		},
-		methods: {			
+		methods: {
+			clickImg(item,index){
+				// 点击图片
+				let imgarr = this.newchapterImgList.map(item => item)				
+				console.log(imgarr,'imgarr')
+				this.imgsShow = false
+				uni.previewImage({
+					current:index,
+					urls: imgarr					
+				})
+			},
+			toRight(){
+				this.nothingShow = true
+			},
+			showImgHandle(){
+				this.imgsShow = true
+			},
 			scroll: function(e) {
 				//	this.oldType = "Vertical"
-				// console.log(e.detail)
+				// setTimeout(() => {
+				// 	//console.log(e.detail)
+				// 	this.topChange = e.detail.scrollTop
+				// },2000)
 				// this.scrollTop = e.detail.scrollTop
 				// this.scrollTop1 = e.detail.scrollTop
 				// 计算当前的page
 				// this.page = parseInt(e.detail.scrollTop / (this.NumCol * this.lineHeight * this.fontSize))
-
+				// this.scroll_end = false;  
+				//             const that = this;  
+				//             this.scrollTop = e.detail.scrollTop;  
+				//             clearTimeout(timer);  
+				//             var timer = setTimeout(function(){  
+				//                 if( e.detail.scrollTop === that.scrollTop ){  
+				//                     that.scroll_end = true;  
+				//                     console.log(that.scroll_end,"是否结束",e.detail.scrollTop, "data", that.scrollTop )  
+				//                     clearTimeout(timer);  
+				//                     timer = null;  // 处理回收   
+				//                 } 
+				
+				// }, 500)  
 			},
 			bookMessage() {
 				this.$http
@@ -661,11 +726,14 @@
 				let arr = [] //数组每一项代表一行	
 				// console.log(copyBookText,'拆分前')
 				let isbiaodian = false
+				this.chapterImgList = []
 				copyBookText.map((res, index) => {
-					res.picAndWord = '' + res.picAndWord
-					if (res.picAndWord.length > colSize - 2) {
+					res.content = '' + res.content
+					// console.log(res.picAndWord)
+					if (res.content.length > colSize - 2) {  
+						//colSize - 2  段落首行空格
 						// 判断是否下一行以标点开始
-						let nextString = res.picAndWord.substr(colSize-2, 1)
+						let nextString = res.content.substr(colSize-2, 1)
 						let haveBiao = 0
 						for (var i=0; i < this.biaodian.length; i++) {
 							if(nextString == this.biaodian[i]) {
@@ -673,14 +741,36 @@
 							}
 						}	
 						//console.log(haveBiao, nextString, 'isbiaodian')
-						arr.push({'paragraph':index,'list':res.picAndWord.substr(0, colSize - 2 - haveBiao), 'level':0, class:'jushou'})
-						let text = res.picAndWord.substr(colSize - 2 - haveBiao )
+						arr.push({'paragraph':index,'list':res.content.substr(0, colSize - 2 - haveBiao), 'level':0, class:'jushou'})
+						let text = res.content.substr(colSize - 2 - haveBiao )
 						that.aginForget(text, arr, colSize, index)
 						
 					} else {
-						arr.push({'paragraph':index,list:res.picAndWord.substr(0, colSize - 2), 'level':0, class:'jushou'})
-					}
+						arr.push({'paragraph':index,list:res.content.substr(0, colSize - 2), 'level':0, class:'jushou'})
+					}					
+					let picAndWord = res.otherContent	
+					// let reg = new RegExp('(?<=(img src="))[^"]*?(?=")/gi)')
+					//let RegEx = /(?<=(img src="))[^"]*?(?=")/gims
+					// let imgArr = picAndWord.match(reg)
+					let imgArr = picAndWord
+					// let imgArr = picAndWord.match(/src*?\/g)
+					
+					this.chapterImgList[index] = imgArr
+					
 				})
+				// 过滤图片数据
+				let arr3 = []
+				this.chapterImgList.map((item,index) =>
+					{ 
+					
+						if(item != null && item != ''){						
+							// console.log(item,'item')
+							arr3.push(item)							
+						}					
+					}
+				)
+				this.newchapterImgList = arr3
+				console.log(this.newchapterImgList, 'newchapterImgList')
 				copyBookText = arr
 				// console.log(copyBookText,'copyBookText')
 				this.getSizePage(NumCol)
@@ -691,10 +781,10 @@
 				// console.log(copyBookText,'拆分前')
 				let isbiaodian = false
 				preText.map((res, index) => {
-					res.picAndWord = '' + res.picAndWord
-					if (res.picAndWord.length > colSize - 2) {
+					res.content = '' + res.content
+					if (res.content.length > colSize - 2) {
 						// 判断是否下一行以标点开始
-						let nextString = res.picAndWord.substr(colSize-2, 1)
+						let nextString = res.content.substr(colSize-2, 1)
 						let haveBiao = 0
 						for (var i=0; i < this.biaodian.length; i++) {
 							if(nextString == this.biaodian[i]) {
@@ -702,12 +792,12 @@
 							}
 						}	
 						//console.log(haveBiao, nextString, 'isbiaodian')
-						arr.push({'paragraph':index,'list':res.picAndWord.substr(0, colSize - 2 - haveBiao), 'level':0, class:'jushou'})
-						let text = res.picAndWord.substr(colSize - 2 - haveBiao )
+						arr.push({'paragraph':index,'list':res.content.substr(0, colSize - 2 - haveBiao), 'level':0, class:'jushou'})
+						let text = res.content.substr(colSize - 2 - haveBiao )
 						that.aginForget(text, arr, colSize, index)
 						
 					} else {
-						arr.push({'paragraph':index,list:res.picAndWord.substr(0, colSize - 2), 'level':0, class:'jushou'})
+						arr.push({'paragraph':index,list:res.content.substr(0, colSize - 2), 'level':0, class:'jushou'})
 					}
 				})
 				preText = arr
@@ -720,10 +810,10 @@
 				// console.log(copyBookText,'拆分前')
 				let isbiaodian = false
 				nextText.map((res, index) => {
-					res.picAndWord = '' + res.picAndWord
-					if (res.picAndWord.length > colSize - 2) {
+					res.content = '' + res.content
+					if (res.content.length > colSize - 2) {
 						// 判断是否下一行以标点开始
-						let nextString = res.picAndWord.substr(colSize-2, 1)
+						let nextString = res.content.substr(colSize-2, 1)
 						let haveBiao = 0
 						for (var i=0; i < this.biaodian.length; i++) {
 							if(nextString == this.biaodian[i]) {
@@ -731,12 +821,12 @@
 							}
 						}	
 						//console.log(haveBiao, nextString, 'isbiaodian')
-						arr.push({'paragraph':index,'list':res.picAndWord.substr(0, colSize - 2 - haveBiao), 'level':0, class:'jushou'})
-						let text = res.picAndWord.substr(colSize - 2 - haveBiao )
+						arr.push({'paragraph':index,'list':res.content.substr(0, colSize - 2 - haveBiao), 'level':0, class:'jushou'})
+						let text = res.content.substr(colSize - 2 - haveBiao )
 						that.aginForget(text, arr, colSize, index)
 						
 					} else {
-						arr.push({'paragraph':index,list:res.picAndWord.substr(0, colSize - 2), 'level':0, class:'jushou'})
+						arr.push({'paragraph':index,list:res.content.substr(0, colSize - 2), 'level':0, class:'jushou'})
 					}
 				})
 				nextText = arr
@@ -770,10 +860,10 @@
 				// console.log(copyBookText,'拆分前')
 				let isbiaodian = false
 				this.tmpChapter.text.map((res, index) => {
-					res.picAndWord = '' + res.picAndWord
-					if (res.picAndWord.length > colSize - 2) {
+					res.content = '' + res.content
+					if (res.content.length > colSize - 2) {
 						// 判断是否下一行以标点开始
-						let nextString = res.picAndWord.substr(colSize-2, 1)
+						let nextString = res.content.substr(colSize-2, 1)
 						let haveBiao = 0
 						for (var i=0; i < this.biaodian.length; i++) {
 							if(nextString == this.biaodian[i]) {
@@ -781,12 +871,12 @@
 							}
 						}	
 						//console.log(haveBiao, nextString, 'isbiaodian')
-						arr.push({'paragraph':index,'list':res.picAndWord.substr(0, colSize - 2 - haveBiao), 'level':0, class:'jushou'})
-						let text = res.picAndWord.substr(colSize - 2 - haveBiao )
+						arr.push({'paragraph':index,'list':res.content.substr(0, colSize - 2 - haveBiao), 'level':0, class:'jushou'})
+						let text = res.content.substr(colSize - 2 - haveBiao )
 						that.aginForget(text, arr, colSize, index)
 						
 					} else {
-						arr.push({'paragraph':index,list:res.picAndWord.substr(0, colSize - 2), 'level':0, class:'jushou'})
+						arr.push({'paragraph':index,list:res.content.substr(0, colSize - 2), 'level':0, class:'jushou'})
 					}
 				})
 				this.tmpChapter.text = arr
@@ -960,6 +1050,9 @@
 				if (this.turnType == 2) {
 					this.isVertical = true;
 				}
+				if (this.turnType == 3) {
+					this.isVerticalHua = true;
+				}
 				if (typeof this.turnType !== 'number') {
 					this.turnType = 0
 				}
@@ -1168,7 +1261,7 @@
 			if (page == 0) {
 				// return this.scrollTop = 0
 				this.domIndex = 0
-				this.createAudio()
+				this.createAudio()				
 				this.musicManuShow = false
 				this.isAudioMenu = true
 			}else{
@@ -1214,14 +1307,18 @@
 			if (this.music.src) {
 				setTimeout(() => {
 					this.music.play(); //执行播放
+					this.musicPlaying = true
 				}, 150)
 			}
 			// 音频播放结束
 			this.music.onEnded(() => {
+				this.musicPlaying = false
 				if (this.domIndex == this.domList.length - 1) {
 					console.log('全部音频播放完毕');
+					
 				} else {
 					console.log('音频播放结束2');
+					
 					this.addDomIndex()
 				}
 			});
@@ -1240,14 +1337,13 @@
 						paragraphindex = item.paragraph
 						return
 					}
-				})
-				console.log(paragraphindex, this.domIndex)
+				})				
 					//return 
 					if(this.domIndex > paragraphindex){
 					this.goNextPage()
 					}
 				
-			},2000)
+			},1000)
 			
 		},
 		// 暂停事件
@@ -1255,19 +1351,22 @@
 			this.isPause = !this.isPause
 			if (this.isPause) {
 				this.music.pause()
+				this.musicPlaying = false
 			} else {
 				this.music.play()
+				this.musicPlaying = true
 			}
 		},
 		//  关闭听书
 		offAudio() {
 			this.music.stop();
 			// this.domIndex = 0;
-			this.highlight = "";
+			this.highlight = "null";
 			this.fhighlight = false
 			this.isAudioMenu = false;
 			this.isPause = false;
 			this.music = null;
+			this.musicPlaying = false
 		},

 		/**
@@ -1617,6 +1716,7 @@
 		 * 触摸结束
 		 **/
 		touchEnd(e) {
+			console.log(e,'e')
 			this.isTouch = false
 			this.showAnimation = true
 			this.showShadow = false
@@ -1625,10 +1725,7 @@
 			if (this.turnType === 0 || this.turnType === 1) {
 				delta = e.changedTouches[0].clientX - this.touchStartX;
 			} else {
-				delta = e.changedTouches[0].clientY - this.touchStartY;
-				console.log(delta, '触摸结束')
-				this.scrollTop += -delta
-				console.log(this.scrollTop, 'scrollTop')
+				delta = e.changedTouches[0].clientY - this.touchStartY;	
 				this.page = parseInt(this.scrollTop / (this.NumCol * this.lineHeight * this.fontSize))
 				console.log(this.page, 'page')
 				//this.getNowReadIndex()
@@ -1636,12 +1733,13 @@

 			if ((delta < 0.8 && delta > -0.8)) { //部分手机点击屏幕时无法做到delta===0
 				if (e.changedTouches[0].clientX < this.windowWidth / 3) { //点击屏幕左1/3为上一页
-					if (!this.prePage.isCover) {
+					if (!this.prePage.isCover) { 
 						this.goPrePage()
 					}
 				} else if (e.changedTouches[0].clientX > this.windowWidth / 3 * 2) { //点击屏幕右1/3为下一页
-					this.goNextPage()
-
+				//if(e.changedTouches[0].clientY > 100){ // 显示弹窗
+					e.changedTouches[0].clientY > 100 ? this.goNextPage() : ''	
+				//}
 				} else if (e.changedTouches[0].clientX <= this.windowWidth / 3 * 2 && e.changedTouches[0].clientX >=
 					this
 					.windowWidth / 3) { //点击屏幕中间1/3为呼出菜单
@@ -1752,7 +1850,7 @@
 			plus.navigator.setFullscreen(false);
 			// #endif
 			this.menuShow = true;
-			if (this.music == null) {
+			if (this.music == null && !this.isVerticalHua) {
 				this.musicManuShow = true;
 			} else {
 				this.musicManuShow = false;
@@ -2386,23 +2484,33 @@
 		changeTurnType(turnType) {
 			if (turnType === this.turnType) {
 				return
-			} else {
-				if (this.oldType == "Vertical") {
-					// 从垂直改成’覆盖’ 或者 ’左右’
-					this.goToPage(this.page + 1)
-					this.oldType == null
-				}
+			} else {				
 				this.showAnimation = false
 				this.turnType = turnType;
 				uni.setStorageSync('turnType', this.turnType)
 			}
-			if (turnType == 2) {
-				this.oldType = "Vertical"
-				// 获取当前的domIndex
-				this.getNowReadIndex()
-				this.isVertical = true
+			if (turnType == 3) {				
+				this.isVerticalHua = true
+				// 如果正在播放音频 则暂停掉
+				if(this.musicPlaying){
+					//console.log('正在播放音频')
+					this.music.pause()
+					this.highlight = "null";
+					this.isAudioMenu = false
+					
+				}
+				uni.showModal({
+					title: '提示',
+					showCancel:false,
+						content: '当前阅读模式下，无听书功能，如想体验听书功能，请切换其他模式，并且阅读进度与其他模式不共享。',
+						success: function (res) {
+							if (res.confirm) {
+								console.log('用户点击确定');
+							}
+						}
+				})
 			} else {
-				this.isVertical = false
+				this.isVerticalHua = false
 			}
 		},

@@ -2555,7 +2663,7 @@
 			preText = this.tmpChapter.text
 			this.mpcounlSystemInfo()
 			this.preChapterTotal = Math.floor(preText.length / this.NumCol) + 1
-			console.log(this.preChapterTotal,'上一章内容页数')			
+			// console.log(this.preChapterTotal,'上一章内容页数')			
 			// 处理数据
 			 
 			// 
@@ -2578,7 +2686,7 @@
 				nextText = this.tmpChapter.text
 				this.nextmpcounlSystemInfo()
 				this.nextChapterTotal = Math.floor(nextText.length / this.NumCol) + 1
-				console.log(this.nextChapterTotal,'下一章内容页数')
+				// console.log(this.nextChapterTotal,'下一章内容页数')
 			} else {
 				this.nextChapter = {
 					ready: true,
@@ -2683,16 +2791,38 @@
 		}
 	},
 	beforeDestroy() {
+		  if(this.musicPlaying){
 			this.music.pause()
+			}
 		},
 		onHide() {
+			if(this.musicPlaying){
 			this.music.pause()
+			}
 		}
 	}
 </script>

 <style lang="scss" scoped>
 	@import url("@/pages/yRead/iconfont.css");
+	.showImgs{ float: right; padding-right: 3px;}
+	.chapterImgTitle{display: block; ;color: #636363; text-align: center; font-size: 30rpx; margin: 10px 0;}
+	.scroll-view_H {
+			white-space: nowrap;
+			width: 100%;
+			.scroll-view-item_H {
+					display: inline-block;
+					width: 100%;
+					//height: 300rpx;
+					//line-height: 300rpx;
+					text-align: center;
+					font-size: 36rpx;
+				}
+				.imgBox{
+					height: 500rpx; overflow: hidden; padding:10px;
+					// img{height: 300rpx !important; width: unset;}
+				}
+		}
 .scroll-Y{height: 600px;}
 	page {
 		position: relative;
@@ -2718,7 +2848,7 @@
 			height: 100%;
 		}
 	}
-
+	.nothingShow{display: block; height: 10%; font-size: 24rpx; color: #636363; margin: 10px 0; text-align: center;}
 	.listenitem {
 		width: 150rpx;
 		height: 150rpx;
@@ -3103,4 +3233,5 @@
 		height: 300rpx;
 	}
 	.jushou{text-indent: 2em;}
+	.item_wrap{flex-wrap: wrap;}
 </style>
--- a/unpackage/debug/.roid.ins
+++ b/unpackage/debug/.roid.ins
@@ -1 +0,0 @@
-installed
--- a/unpackage/debug/android_debug.apk
+++ b/unpackage/debug/android_debug.apk