翻页效果

This commit is contained in:
@fawn-nine
2023-04-04 17:25:50 +08:00
parent dea49e6385
commit 9f63a8a989
8 changed files with 11608 additions and 119 deletions

View File

@@ -19,7 +19,7 @@
"prompt" : "template", "prompt" : "template",
"template" : { "template" : {
"title" : "用户协议和隐私政策", "title" : "用户协议和隐私政策",
"message" : "请你务必审慎阅读、充分理解“隐私政策”各条款,包括但不限于:为了更好的向你提供服务,我们需要收集你的设备标识、操作日志等信息用于分析、优化应用性能。<br/>  你可阅读<a href='https://www.twin-ui.com'>《用户协议》</a>和<a href='https://www.twin-ui.com'>《隐私政策》</a>了解详细信息。如果你同意,请点击下面按钮开始接受我们的服务。", "message" : "请你务必审慎阅读、充分理解“隐私政策”各条款,包括但不限于:为了更好的向你提供服务,我们需要收集你的设备标识、操作日志等信息用于分析、优化应用性能。<br/>  你可阅读<a href='https://main.nuttyreading.com/agreement.html'>《用户协议》</a>和<a href='https://main.nuttyreading.com/privacy.html'>《隐私政策》</a>了解详细信息。如果你同意,请点击下面按钮开始接受我们的服务。",
"buttonAccept" : "同意", "buttonAccept" : "同意",
"buttonRefuse" : "暂不同意" "buttonRefuse" : "暂不同意"
} }

View File

@@ -310,8 +310,9 @@ formatRichText (html) { //控制小程序中图片大小
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.xiangqing { .xiangqing {
overflow: hidden; overflow: hidden; overflow-x: hidden;
img{display: block; max-width: 100%;} img{display: block; max-width: 100%;}
p{max-width: 100%;}
} }
.goods_nav { .goods_nav {
z-index: 1; z-index: 1;

View File

@@ -195,7 +195,7 @@
return { return {
scrollTop: 0, scrollTop: 0,
list3: [ list3: [
'../../static/icon/home_ban_1.jpg', // '../../static/icon/home_ban_1.jpg',
'../../static/icon/home_ban_2.jpg', '../../static/icon/home_ban_2.jpg',
'../../static/icon/home_ban_3.jpg', '../../static/icon/home_ban_3.jpg',
], ],

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@@ -56,55 +56,12 @@
</view> </view>
<!-- 垂直翻页 --> <!-- 垂直翻页 -->
<!-- @click="showMenu" --> <!-- @click="showMenu" -->
<view class="vertical" v-if="isVerticalHua">
<view class="verticalbox" :class="{ container0: background === 1, container1: background === 2 }"
@click="showMenu">
<!-- 章节名 -->
<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">
<view class="content">
<view class="inner-box" :style="{ height: `${innerHeight}px` }" v-if="verticalData.canRead">
<view style="text-indent: 2em;" v-for="(item, index) in verticalData.text" :key="index"
:class="highlight === index ? 'highlight' : ''">
<p class="book-inner" v-html="item.content" :style="{
fontWeight: item.level == 2 ? 'bold' : item.level == 3 ? 'bold' : '',
fontSize: `${fontSize}px`,
lineHeight: `${lineHeight * fontSize}px`,
color: `${colorList[background - 1]}`
}"></p>
<img style="max-width: 90%;" v-if="item.otherContent != '' && item.otherContent != null"
:src="item.otherContent">
</view>
</view>
<view
style="display:flex;flex-flow: column;justify-content: center;align-items: center;height: 100%;"
v-else>
付费章节
<view style="padding: 5px 15px;background-color: #eee;" @touchstart.stop @touchmove.stop
@touchend.stop="buyBook">去购买</view>
</view>
</view>
</scroll-view>
<view class="bottom-bar">
<!-- 时间 -->
<view>{{ systemTimeStr }}</view>
<!-- 电量 -->
<view>
<battery :level="batteryLevel" :charging="batteryState === 2"></battery>
</view>
</view>
</view>
</view>
<!-- 横向翻页 --> <!-- 横向翻页 -->
<view class="across" v-else> <view class="across" >
<!-- 阅读页结构和样式请和仅用于计算元素一致 --> <!-- 阅读页结构和样式请和仅用于计算元素一致 -->
<view class="chantong" v-show="!isSimulation"> <view class="chantong" style="display: none;">
<!-- 上一页 --> <!-- 上一页 -->
<view class="container mypages" :class="{ container0: background === 1, container1: background === 2 }" <view class="container mypages" :class="{ container0: background === 1, container1: background === 2 }"
:style="{ :style="{
@@ -190,8 +147,6 @@
<battery :level="batteryLevel" :charging="batteryState === 2"></battery> <battery :level="batteryLevel" :charging="batteryState === 2"></battery>
</view> </view>
</view> </view>
</view> </view>
<!-- 下一页--> <!-- 下一页-->
@@ -234,20 +189,22 @@
</view> </view>
</view> </view>
<!-- 仿真翻页 --> <!-- 仿真翻页 -->
<view v-show="isSimulation" class="flipbook-viewport" <view v-if="isSimulation" class="flipbook-viewport"
:rect="rect" :rect="rect"
:change:rect="updateRenderData" :change:rect="updateRenderData"
:readerSet = "readerSet"
:change:readerSet="updateReaderSet"
:musicItem="musicItem" :musicItem="musicItem"
:change:musicItem="updateMusic" :change:musicItem="updateMusic"
:oldReadSpeed="oldReadSpeed" :oldReadSpeed="oldReadSpeed"
:change:oldReadSpeed="updateReadPercent" :change:oldReadSpeed="updateReadPercent"
:SimulationText="SimulationText" :change:SimulationText="updateSimulationText" :SimulationTextObj="SimulationTextObj" :change:SimulationTextObj="updateSimulationText"
@touchend="turnjs.onClick" @touchend="turnjs.onClick"
> >
<!-- <view class="container across" @touchend="openEnd" @touchstart="openStart"> --> <!-- <view class="container across" @touchend="openEnd" @touchstart="openStart"> -->
<view class="container across" > <view class="container across" >
<view class="flipbook" id="flipbook" > <view class="flipbook" id="flipbook" >
<div class="hard"><img style="max-width: 100%;" :src="bookFengMian"></div> <div class="hard" style="text-align: center; display: none; background-color:rgba(255, 255, 255, .6); display: flex; align-items: center; justify-content: center;"><div><img style="max-width:50%; border-radius: 20rpx;" :src="bookFengMian"> <p style="background-color: #fff; color: #666; ">->点击两侧开启阅读<-</p> </div></div>
<!-- <div style="background-color: #fff; padding: 0 10px" v-for="(item, index) in SimulationText" :key="index"> <!-- <div style="background-color: #fff; padding: 0 10px" v-for="(item, index) in SimulationText" :key="index">
<div class="chapter">{{ curPage.chapterName }}</div> <div class="chapter">{{ curPage.chapterName }}</div>
<p v-for="(item1, index1) in item" :key="index1" v-html="item1.list" <p v-for="(item1, index1) in item" :key="index1" v-html="item1.list"
@@ -700,6 +657,7 @@ import { nextTick } from "vue";
freeChapterCount: 0, freeChapterCount: 0,
isBuy: 0, isBuy: 0,
isVip: 0, isVip: 0,
chapterNum:null, // 阅读章节数
}, },
isVerticalHua: false, isVerticalHua: false,
speedTrue: false, //判断是否更新进度 speedTrue: false, //判断是否更新进度
@@ -726,10 +684,14 @@ import { nextTick } from "vue";
width: uni.getSystemInfoSync().windowWidth, width: uni.getSystemInfoSync().windowWidth,
height: '800px', height: '800px',
text: 'hello', text: 'hello',
isSimulation: true, // 仿真翻页模式 isSimulation: true, // 仿真翻页模式
SimulationText: [], // 仿真翻页内容数组 SimulationTextObj : { // 仿真翻页内容
hasSimulationText: false, 'SimulationText' : [],
setShow: true, // 设置显示? 'fontSize' : '',
'lineHeight':'',
'oldReadPage':0
},
setShow: false, // 设置显示?
clientlast: null, //开始位置 clientlast: null, //开始位置
touchNum: 0, //点击次数 touchNum: 0, //点击次数
touchTime: null, //定时器清除 touchTime: null, //定时器清除
@@ -738,6 +700,12 @@ import { nextTick } from "vue";
musicIndexDom:0, musicIndexDom:0,
highlight: 'null', highlight: 'null',
musicPlaying:false, musicPlaying:false,
},
readerSet:{
fontSize:'', // 字体大小,
lineHeight:'' ,// 行高注意是fontSize的倍数
page:0,
background:''
} }
} }
}, },
@@ -789,8 +757,22 @@ import { nextTick } from "vue";
} }
}, },
// watch: {
// changeBackground: { // 深度监听
// handler(newName, oldName) {
// console.log(newName)
// },
// immediate: true,
// deep: true
// }
// },
methods: { methods: {
_changeReaderSeting(){
this.readerSet.fontSize = this.fontSize, //字体大小,
this.readerSet.lineHeight = this.lineHeight //行高注意是fontSize的倍数
},
changeMusicItem(){ changeMusicItem(){
this.musicItem.highlight = this.highlight, this.musicItem.highlight = this.highlight,
this.musicItem.musicIndexDom = this.domIndex, this.musicItem.musicIndexDom = this.domIndex,
@@ -827,7 +809,7 @@ import { nextTick } from "vue";
clickImg(item, index) { clickImg(item, index) {
// 点击图片 // 点击图片
let imgarr = this.newchapterImgList.map(item => item) let imgarr = this.newchapterImgList.map(item => item)
console.log(imgarr, 'imgarr') // console.log(imgarr, 'imgarr')
this.imgsShow = false this.imgsShow = false
uni.previewImage({ uni.previewImage({
current: index, current: index,
@@ -868,8 +850,12 @@ import { nextTick } from "vue";
.post('book/book/appinfo/' + this.bookId_mark + '/' + this.userInfo.id) .post('book/book/appinfo/' + this.bookId_mark + '/' + this.userInfo.id)
.then(res => { .then(res => {
this.bookName = res.book.name, this.bookName = res.book.name,
this.bookFengMian = res.book.images this.bookFengMian = res.book.images,
console.log('获取电子书详情', res) this.detail.freeChapterCount = res.book.freeChapterCount,
this.detail.isBuy = res.book.isBuy,
this.detail.isVip = res.book.isVip,
this.detail.chapterNum = res.book.chapterNum // 阅读章节数
//console.log('获取电子书详情', res)
}); });
@@ -1015,8 +1001,7 @@ import { nextTick } from "vue";
} }
}) })
preText = arr preText = arr
// console.log(copyBookText,'copyBookText') // console.log(copyBookText,'copyBookText')
// this.getSizePage(NumCol)
}, },
nextmpforGet(colSize, NumCol) { nextmpforGet(colSize, NumCol) {
let that = this let that = this
@@ -1150,10 +1135,15 @@ import { nextTick } from "vue";
} }
} }
arr.push(newArr) arr.push(newArr)
copyBookText = arr // 每一页显示的内容 copyBookText = arr // 每一页显示的内容
this.SimulationText = [] this.SimulationTextObj = {
this.SimulationText = arr SimulationText : arr,
this.hasSimulationText = true fontSize : this.fontSize,
lineHeight : this.lineHeight,
oldReadPage: 0,
background:this.background
}
// this.hasSimulationText = true
console.log(this.SimulationText, 'SimulationText') console.log(this.SimulationText, 'SimulationText')
}, },
@@ -1293,6 +1283,8 @@ import { nextTick } from "vue";
if (typeof this.background !== 'number') { if (typeof this.background !== 'number') {
this.background = 1 this.background = 1
} }
// this.readerSet.background = this.background
this.turnType = uni.getStorageSync('turnType') this.turnType = uni.getStorageSync('turnType')
if (this.turnType == 2) { if (this.turnType == 2) {
this.isVertical = true; this.isVertical = true;
@@ -1312,11 +1304,13 @@ import { nextTick } from "vue";
this.history = value this.history = value
} }
}) })
this.$nextTick(()=>{
this._changeReaderSeting()
})
/*****************************************/ /*****************************************/
/*****************************************/ /*****************************************/
/*****************************************/ /*****************************************/
}, },
/** /**
@@ -1344,7 +1338,16 @@ import { nextTick } from "vue";
let page = Math.floor((this.curChapter.totalPage - 1) * this.history.progress) let page = Math.floor((this.curChapter.totalPage - 1) * this.history.progress)
this.oldReadSpeed.readPage = page this.oldReadSpeed.readPage = page
this.goToPage(page) this.goToPage(page)
this.SimulationTextObj.SimulationText = []
this.SimulationTextObj = {
SimulationText : copyBookText,
fontSize : this.fontSize,
lineHeight : this.lineHeight,
oldReadPage: this.oldReadSpeed.readPage,
background:this.background
}
uni.hideLoading() uni.hideLoading()
}, },
/** /**
@@ -2448,10 +2451,18 @@ import { nextTick } from "vue";
}) })
setTimeout(() => { setTimeout(() => {
this.getThreeChapter(this.curChapter.chapterIndex + 1) this.getThreeChapter(this.curChapter.chapterIndex + 1)
// this.SimulationTextObj = {
// SimulationText : copyBookText,
// fontSize : this.fontSize,
// lineHeight : this.lineHeight,
// oldReadPage: 0
// // background:this.background
// }
uni.hideLoading() uni.hideLoading()
this.down = true this.down = true
this.clearDown() this.clearDown()
}, 300) }, 300)
} else { } else {
uni.showToast({ uni.showToast({
icon: 'none', icon: 'none',
@@ -2526,6 +2537,7 @@ import { nextTick } from "vue";
this.currentPage = page this.currentPage = page
this.showAnimation = false this.showAnimation = false
console.log(page, '======>') console.log(page, '======>')
// console.log(copyBookText[page],'当前页') // console.log(copyBookText[page],'当前页')
this.$nextTick(function() { this.$nextTick(function() {
this.curPage = { this.curPage = {
@@ -2651,6 +2663,14 @@ import { nextTick } from "vue";
title: '加载中' title: '加载中'
}) })
await this.getThreeChapter(index.id) await this.getThreeChapter(index.id)
//this.SimulationTextObj.SimulationText = []
this.SimulationTextObj = {
SimulationText : copyBookText,
fontSize : this.fontSize,
lineHeight : this.lineHeight,
oldReadPage: 0,
background:this.background
}
//this.counlSystemInfo() //this.counlSystemInfo()
this.goToPage(0) this.goToPage(0)
this.scrollTop = 0 this.scrollTop = 0
@@ -2669,10 +2689,15 @@ import { nextTick } from "vue";
this.fontSize += 2 this.fontSize += 2
uni.setStorageSync('fontSize', this.fontSize) uni.setStorageSync('fontSize', this.fontSize)
this.calcHeight() this.calcHeight()
copyBookText = this.curChapter.text; copyBookText = this.curChapter.text;
this.counlSystemInfo() this.counlSystemInfo()
await this.calcCurChapter() await this.calcCurChapter()
let page = Math.floor((this.curChapter.totalPage - 1) * progress) let page = Math.floor((this.curChapter.totalPage - 1) * progress)
this.readerSet = {
fontSize : this.fontSize,
page : page
}
this.oldReadSpeed.readPage = page
this.goToPage(page) this.goToPage(page)
if (this.preChapter.ready && !this.preChapter.isCover) { if (this.preChapter.ready && !this.preChapter.isCover) {
this.preChapter.ready = false this.preChapter.ready = false
@@ -2681,7 +2706,7 @@ import { nextTick } from "vue";
if (this.nextChapter.ready && !this.nextChapter.isEnd) { if (this.nextChapter.ready && !this.nextChapter.isEnd) {
this.nextChapter.ready = false this.nextChapter.ready = false
await this.calcNextChapter() await this.calcNextChapter()
} }
}, },
/** /**
@@ -2692,10 +2717,15 @@ import { nextTick } from "vue";
this.fontSize -= 2 this.fontSize -= 2
uni.setStorageSync('fontSize', this.fontSize) uni.setStorageSync('fontSize', this.fontSize)
this.calcHeight() this.calcHeight()
copyBookText = this.curChapter.text; copyBookText = this.curChapter.text;
this.counlSystemInfo() this.counlSystemInfo()
await this.calcCurChapter() await this.calcCurChapter()
let page = Math.floor((this.curChapter.totalPage - 1) * progress) let page = Math.floor((this.curChapter.totalPage - 1) * progress)
this.readerSet = {
fontSize : this.fontSize,
page : page
}
this.oldReadSpeed.readPage = page
this.goToPage(page) this.goToPage(page)
if (this.preChapter.ready && !this.preChapter.isCover) { if (this.preChapter.ready && !this.preChapter.isCover) {
this.preChapter.ready = false this.preChapter.ready = false
@@ -2705,6 +2735,7 @@ import { nextTick } from "vue";
this.nextChapter.ready = false this.nextChapter.ready = false
await this.calcNextChapter() await this.calcNextChapter()
} }
}, },
/** /**
@@ -2718,10 +2749,15 @@ import { nextTick } from "vue";
this.lineHeight = lineHeight; this.lineHeight = lineHeight;
uni.setStorageSync('lineHeight', this.lineHeight) uni.setStorageSync('lineHeight', this.lineHeight)
this.calcHeight() this.calcHeight()
copyBookText = this.curChapter.text; copyBookText = this.curChapter.text;
this.counlSystemInfo() this.counlSystemInfo()
await this.calcCurChapter() await this.calcCurChapter()
let page = Math.floor((this.curChapter.totalPage - 1) * progress) let page = Math.floor((this.curChapter.totalPage - 1) * progress)
this.readerSet = {
lineHeight : this.lineHeight,
page : page
}
this.oldReadSpeed.readPage = page
this.goToPage(page) this.goToPage(page)
if (this.preChapter.ready && !this.preChapter.isCover) { if (this.preChapter.ready && !this.preChapter.isCover) {
this.preChapter.ready = false this.preChapter.ready = false
@@ -2732,6 +2768,7 @@ import { nextTick } from "vue";
await this.calcNextChapter() await this.calcNextChapter()
} }
} }
}, },
@@ -2784,8 +2821,20 @@ import { nextTick } from "vue";
if (background === this.background) { if (background === this.background) {
return return
} else { } else {
this.background = background; this.background = background;
uni.setStorageSync('background', this.background) uni.setStorageSync('background', this.background)
// this.readerSet.background = background // 修改阅读器背景
this.SimulationTextObj.background = this.background
this.SimulationTextObj.oldReadPage = this.curPage.pageNum
console.log('改变页面背景',this.curPage.pageNum)
// this.SimulationTextObj = {
// SimulationText : this.SimulationTextObj.SimulationText,
// fontSize : this.SimulationText.fontSize,
// lineHeight : this.SimulationText.lineHeight,
// background: this.background,
// page: this.oldReadSpeed.readPage
// }
} }
}, },
@@ -2849,27 +2898,28 @@ import { nextTick } from "vue";
* 获取一章数据 * 获取一章数据
**/ **/
getOneChapter(chapterId, showLoading) { getOneChapter(chapterId, showLoading) {
if (showLoading) { if (showLoading) {
uni.showLoading({ uni.showLoading({
title: '加载中', title: '加载中',
mask: true mask: true
}) })
} }
// 检查是否已经购买
// this.bookMessage.isBuy==0&&this.bookMessage.chapterNum==null&&this.bookMessage.freeChapterCount!=0
return this.$http return this.$http
.post('book/bookchaptercontent/appGetBookChapterContent', { .post('book/bookchaptercontent/appGetBookChapterContent', {
'userId': this.userInfo.id, 'userId': this.userInfo.id,
'bookid': this.bookId_mark, 'bookid': this.bookId_mark,
'chapterid': chapterId 'chapterid': chapterId
}) })
.then(res => { .then(res => {
this.tmpChapter.text = res.bookCatalogue this.tmpChapter.text = res.bookCatalogue
// console.log(this.tmpChapter.text,'tmpChapter') // console.log(this.tmpChapter.text,'tmpChapter')
}) })
.catch(() => { .catch(() => {
// 此处是网络连接失败的逻辑 // 此处是网络连接失败的逻辑
uni.hideLoading() uni.hideLoading()
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
uni.showModal({ uni.showModal({
title: '连接失败', title: '连接失败',
@@ -2886,8 +2936,8 @@ import { nextTick } from "vue";
} }
} }
}) })
}) })
}) })
/*****************************************/ /*****************************************/
/*****************************************/ /*****************************************/
/*****************************************/ /*****************************************/
@@ -3054,8 +3104,8 @@ import { nextTick } from "vue";
}, },
// 接收renderjs发回的数据 // 接收renderjs发回的数据
onViewClick(options) { onViewClick(options) {
console.log('renderjsCall回调'); console.log('renderjsCall回调');
console.log(options); console.log(options);
if(options.chapterid == 'next'){ // 下一章 if(options.chapterid == 'next'){ // 下一章
this.goNextChapter() this.goNextChapter()
}else if(options.chapterid == 'prev'){ // 上一章 }else if(options.chapterid == 'prev'){ // 上一章
@@ -3079,7 +3129,7 @@ import { nextTick } from "vue";
if (this.musicPlaying) { if (this.musicPlaying) {
this.music.pause() this.music.pause()
} }
}, },
} }
</script> </script>
<script lang="renderjs" module="turnjs"> <script lang="renderjs" module="turnjs">
@@ -3099,20 +3149,33 @@ import { nextTick } from "vue";
lastPage:false, lastPage:false,
musicIndexDom:0, musicIndexDom:0,
highlight:'null', highlight:'null',
musicPlaying:false musicPlaying:false,
fontSize:'',
lineHeight:'',
containerStyle: ''
} }
}, },
mounted() { mounted() {
this.onTurn(); this.onTurn();
}, },
methods: { methods: {
updateMusic(newVal, oldVal){ updateReaderSet(newVal, oldVal){
// 阅读器设置更新
$("#flipbook .paragraph").css({fontSize:newVal.fontSize+"px", lineHeight:newVal.lineHeight*newVal.fontSize+"px"})
console.log(newVal,'阅读器设置更新')
if(newVal.page > 0 && newVal.fontSize !== this.fontSize || newVal.page > 0 && newVal.lineHeight !== this.lineHeight){
$("#flipbook").turn('page',newVal.page+1)
}
// newVal.background == 1 ? this.containerStyle = "#f7faf9" : this.containerStyle = "#000"
// $(".myPage p").css({backgroundColor:this.containerStyle})
},
updateMusic(newVal, oldVal){ //听书
this.highlight = newVal.highlight this.highlight = newVal.highlight
this.musicIndexDom = newVal.musicIndexDom this.musicIndexDom = newVal.musicIndexDom
this.musicPlaying = newVal.musicPlaying this.musicPlaying = newVal.musicPlaying
console.log(newVal,'听书配置项有变化') console.log(newVal,'听书配置项有变化')
let page = 1 let page = 1
page = $("#flipbook").turn('page') page = $("#flipbook").turn('page')
if(newVal.musicPlaying){ if(newVal.musicPlaying){
// 开启听书 // 开启听书
$("#flipbook .paragraph"+newVal.musicIndexDom).css({color:"#e5d6a0"}) $("#flipbook .paragraph"+newVal.musicIndexDom).css({color:"#e5d6a0"})
@@ -3125,8 +3188,8 @@ import { nextTick } from "vue";
updateReadPercent(newVal, oldVal){ updateReadPercent(newVal, oldVal){
// 获取阅读进度 // 获取阅读进度
this.curPage = newVal.readPage this.curPage = newVal.readPage
console.log('获取到了阅读的进度page',newVal,this.curPage) // console.log('获取到了阅读的进度page',newVal,this.curPage)-
$("#flipbook").turn('page', this.curPage+1) //$("#flipbook").turn('page', this.curPage+1)
}, },
updateRenderData(newVal, oldVal) { updateRenderData(newVal, oldVal) {
let { let {
@@ -3138,24 +3201,28 @@ import { nextTick } from "vue";
}, },
updateSimulationText(newVal, oldVal) { updateSimulationText(newVal, oldVal) {
$("#flipbook").turn('pages',1) // 内容变化时,保留 $("#flipbook").turn('pages',1) // 内容变化时,保留1页
$("#flipbook").turn('pages',newVal.length) $("#flipbook").turn('pages',newVal.SimulationText.length)
// this.onTurn(); // this.onTurn();
// this.SimulationText = newVal // this.SimulationText = newVal
console.log('更新数组', $("#flipbook").turn("resize")) console.log('更新数组', newVal)
for (var i=0; i<newVal.length;i++) { this.fontSize = newVal.fontSize
this.lineHeight = newVal.lineHeight
newVal.background == 1 ? this.containerStyle = "#f7faf9" : this.containerStyle = "#000"
//$(".myPage p").css({backgroundColor:this.containerStyle})
for (var i=0; i<newVal.SimulationText.length;i++) {
var tagHtml = ""; var tagHtml = "";
var conntentHtml = ""; var conntentHtml = "";
for (var j=0; j<newVal[i].length; j++) { for (var j=0; j<newVal.SimulationText[i].length; j++) {
var classname = '' var classname = ''
var styleconteent = '' var styleconteent = ''
newVal[i][j].class == 'jushou' ? classname = 'shouhang' : '' newVal.SimulationText[i][j].class == 'jushou' ? classname = 'shouhang' : ''
newVal[i][j].class == 'jushou' ? styleconteent = 'text-indent:2em' : '' newVal.SimulationText[i][j].class == 'jushou' ? styleconteent = `"text-indent:2em ;font-size:${newVal.fontSize}px; color: #5d5d5d"` : styleconteent = "'font-size:"+newVal.fontSize+"px ; line-height:"+newVal.lineHeight*newVal.fontSize+"px; color: #5d5d5d'"
conntentHtml += "<p class='paragraph " + classname + " paragraph" + newVal[i][j].paragraph +"' style="+styleconteent+">" + newVal[i][j].list + "</p>" conntentHtml += "<p class='paragraph " + classname + " paragraph" + newVal.SimulationText[i][j].paragraph +"' style="+styleconteent+">" + newVal.SimulationText[i][j].list + "</p>"
} }
var page1 = i+1 var page1 = i+1
var btnStyle = "display: block; padding: 20rpx; border: 1px solid #333; text-align: center;" var btnStyle = "display: block; padding: 20rpx; border: 1px solid #333; text-align: center;"
var tagHtml = "<div style='background-color:#fff; padding: 0 12px; font-size:18px; line-height:28px'>"+ conntentHtml +"<div style='text-align:center; color:#777'>"+page1+"/"+ newVal.length +"</div></div>"; var tagHtml = "<div style='padding:0 18px; position:relative; background-color:"+this.containerStyle+"; height:inherit'>"+ conntentHtml +"<div style='text-align:center; color:#777 ; position: absolute;bottom: 5px; left: 0;text-align: center; width: 100%;' >"+page1+"/"+ newVal.SimulationText.length +"</div></div>";
// $("#flipbook").append(tagHtml); // $("#flipbook").append(tagHtml);
if (!$("#flipbook").turn('hasPage', i+2)) { if (!$("#flipbook").turn('hasPage', i+2)) {
// Create an element for this page // Create an element for this page
@@ -3165,11 +3232,14 @@ import { nextTick } from "vue";
element.html(tagHtml); element.html(tagHtml);
} }
} }
// 如果有阅读缓存
if(newVal.oldReadPage>0){
$("#flipbook").turn('page', newVal.oldReadPage+1)
}else{
$("#flipbook").turn('page', 2)
}
}, },
toprev(){
console.log('点击了')
},
onClick(event, ownerInstance) { onClick(event, ownerInstance) {
if (event.changedTouches[0].clientX < this.width / 3) { //点击屏幕左1/3为上一页 if (event.changedTouches[0].clientX < this.width / 3) { //点击屏幕左1/3为上一页
//console.log('点击了左侧') //console.log('点击了左侧')
@@ -3243,31 +3313,26 @@ import { nextTick } from "vue";
height: this.height, height: this.height,
width: this.width, width: this.width,
elevation: 50, elevation: 50,
duration:1000, duration:500,
gradients: true, gradients: true,
when: { when: {
turning: function(event, page, pageObject) { turning: function(event, page, pageObject) {
// 翻页时 // 翻页时
// console.log(event, page, pageObject,this.curPage) // this.curPage = page
}, // console.log(event, page, pageObject,this.curPage)
}, }
} });
});
// $("#flipbook").bind("last", function(event) {
// console.log("You are at the end of the flipbook");
// this.lastPage = true
// });
} }
}
}
} }
</script> </script>
<style> <style>
/* .container1{background-color: #000;} */
.buts{width: 100%; display:flex; } .buts{width: 100%; display:flex; }
.buts span{display: block; padding: 20rpx; border: 1px solid #333; text-align: center;} .buts span{display: block; padding: 20rpx; border: 1px solid #333; text-align: center;}
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
@import url("@/pages/yRead/iconfont.css"); @import url("@/pages/yRead/iconfont.css");
// turnjs // turnjs
/// .shouhang{text-indent: 2em;color: red;} /// .shouhang{text-indent: 2em;color: red;}

File diff suppressed because it is too large Load Diff

44
新建 文本文档.txt Normal file
View File

@@ -0,0 +1,44 @@
app 描述疯子读书是一款专业的中医线上读书平台。中医古籍、中医经典各家学说各种中医类型的电子书。疯子读书不止可以看还可以听APP内还具有听书功能解放您的眼睛。
简短概括:一款专业的中医线上读书软件
公司名称:天津众妙之门科技有限公司
隐私政策地址https://main.nuttyreading.com/privacy.html
各个平台账号密码:
天津众妙之门科技有限公司【疯子阅读】
1、阿里云 https://account.aliyun.com/
账号:众妙之门花生享阅
密码FZDS1234fzds
手机18526084267
2、苹果【每年有会费688需要缴纳】
apple idhuashengdingyue@163.com
密码HSDY1234hsdy
账号主体联系人:皮诺曦
3、华为开放平台 https://id1.cloud.huawei.com/
账号18526084267
密码HSXY1234hsxy
4、腾讯应用宝 https://open.qq.com/
huashengdingyue@163.com
账号2711345245
密码HSDY1234hsdy
5、小米
账号13110039505
密码HSXY1234hsxy
绑定邮箱huashengdingyue@163.com
6、百度智能云 https://cloud.baidu.com/
(文字转语音阅读“听书”)
账户:天津众妙之门
密码HSDY1234hsdy
7、快递100
账户名fengzidushu
密码wu751019
8、疯子读书163邮箱
邮箱账号fengzidushu@163.com
邮箱密码FZDS1234fzds
9、微信开放平台
账号fengzidushu@163.com
密码FZDS1234fzds