1.开屏动画修改2.数字人播报修改
Before Width: | Height: | Size: 1.7 MiB After Width: | Height: | Size: 4.7 MiB |
Before Width: | Height: | Size: 298 KiB |
Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 2.4 KiB |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 2.3 KiB |
@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="no-scroll">
|
||||
<div v-if="page2">
|
||||
<div id="book" class="book" >
|
||||
<div class="page1">
|
||||
<div id="book" class="book">
|
||||
<div class="page1" @click="startAutoTurn">
|
||||
<img src="/public/static/book.jpg" style="width: 100%;height: 100%;">
|
||||
</div>
|
||||
<div class="page2"></div>
|
||||
@ -193,13 +193,13 @@ export default {
|
||||
// console.log('Component deactivated++++++++++++++++');
|
||||
// },
|
||||
mounted() {
|
||||
var page=sessionStorage.getItem('page');
|
||||
if(page==1){
|
||||
this.page2=false;
|
||||
}else{
|
||||
var page = sessionStorage.getItem('page');
|
||||
if (page == 1) {
|
||||
this.page2 = false;
|
||||
} else {
|
||||
this.onTurn();
|
||||
}
|
||||
|
||||
|
||||
//window.addEventListener('popstate', this.handlePopState);
|
||||
console.log(this.data);
|
||||
if (this.$route.query) {
|
||||
@ -415,6 +415,7 @@ export default {
|
||||
},
|
||||
|
||||
onTurn() {
|
||||
var that = this;
|
||||
this.$nextTick(() => {
|
||||
$('#book').turn({
|
||||
acceleration: true, //启用硬件加速,移动端有效
|
||||
@ -425,12 +426,21 @@ export default {
|
||||
autoCenter: true, //
|
||||
turnCorners: 'br', // 设置可翻页的页角(都试过了,乱写 4个角都能出发卷起), bl,br tl,tr bl,tr
|
||||
height: '100vh', //页面高度
|
||||
width: '100%' //翻书范围宽度,总宽度
|
||||
width: '100%', //翻书范围宽度,总宽度
|
||||
when: {
|
||||
last: function (e, page) {
|
||||
console.log('last');
|
||||
setTimeout(() => {
|
||||
that.page2 = false;
|
||||
sessionStorage.setItem('page', 1);
|
||||
}, 1000)
|
||||
},
|
||||
}
|
||||
});
|
||||
// 添加自动翻页功能
|
||||
setTimeout(() => {
|
||||
this.startAutoTurn();
|
||||
}, 1500)
|
||||
// setTimeout(() => {
|
||||
// this.startAutoTurn();
|
||||
// }, 2000)
|
||||
|
||||
})
|
||||
},
|
||||
@ -440,7 +450,7 @@ export default {
|
||||
book.turn('next');
|
||||
setTimeout(() => {
|
||||
this.page2 = false;
|
||||
sessionStorage.setItem('page',1);
|
||||
sessionStorage.setItem('page', 1);
|
||||
}, 1000)
|
||||
|
||||
},
|
||||
@ -548,4 +558,8 @@ div[id^=reader-helper] {
|
||||
.super_copy_btns_btn:active {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.no-scroll {
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
|
@ -9,7 +9,7 @@
|
||||
<!-- <div style="padding: 10px 0px;" v-if="activeDate.video != '' && activeDate.video != null">
|
||||
<video :src="activeDate.video" controls style="width: 100%;max-height: 300px;margin: 0px auto;"></video>
|
||||
</div> -->
|
||||
<div style="margin-top: 15px;">
|
||||
<div style="margin-top: 15px;" v-if="activeDate.video != '' && activeDate.video != null">
|
||||
<img src="/public/static/top_video.png" @click="showModal = true" style="width: 100%;">
|
||||
</div>
|
||||
<div id="imgBox" :class="'font' + fontSize" style="line-height: 30px;" v-html="activeDate.content"></div>
|
||||
@ -18,12 +18,15 @@
|
||||
</div> -->
|
||||
|
||||
<div id="PageBtn">
|
||||
<div style="position: fixed;bottom: 290px;right: 15px;z-index: 100;">
|
||||
<div style="position: fixed;bottom: 290px;right: 20px;z-index: 100;">
|
||||
<div id="read-btn" @click="readMp3()">
|
||||
<img v-if="!isPlay" src="/public/static/stop.png" style="width: 50px;height: 50px;">
|
||||
<img v-if="isPlay" src="/public/static/bf.gif" style="width: 50px;height: 50px;">
|
||||
<img v-if="!isPlay" src="/public/static/voice_pause.png" style="width: 40px;height: 40px;">
|
||||
<img v-if="isPlay" src="/public/static/voice_play.png" style="width: 40px;height: 40px;">
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="isPlay" style="position: fixed;bottom: 40px;left: 10px;">
|
||||
<img src="/public/static/bf.gif" style="width: 80px;height: 100%;">
|
||||
</div>
|
||||
<div class="MenuBox">
|
||||
<a id="Haibao_share" @click="copy()" href="javascript:(-1);"
|
||||
style="background-image: url(/h5/public/static/share.png);background-position: center;background-repeat: repeat;"></a>
|
||||
@ -81,7 +84,6 @@ const copy = () => {
|
||||
const audioPlayer = ref(null);
|
||||
const isPlay = ref(false);
|
||||
const readMp3 = () => {
|
||||
console.log(audioPlayer.value.error);
|
||||
if (audioPlayer.value.error != null) {
|
||||
alert('音频生成中,请稍候再试!');
|
||||
return;
|
||||
|