zm/nuttyreading-html
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

阶段性上传

Browse Source
This commit is contained in:
@fawn-nine
2023-09-08 18:06:39 +08:00
parent 7b9044f4df
commit b0cc2b8663
62 changed files with 5075 additions and 506 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
pages/bookShop/classify.vue
View File

@@ -86,7 +86,7 @@
bgiStyle: {
background: '#2ab58833'
},
iconStyle: {
iconStyle: {
fontSize: '40rpx',
fontWeight: 'bold',
color: '#54a966',

14
pages/bookShop/commodityDetail.vue
View File

@@ -29,8 +29,10 @@
<view v-if="contentShow == 0">
<view class="tingshuList" v-if="listenList.length > 0">
<h4>赠送听书权益</h4>
<view class="item flexbox" v-for="item in listenList" :key="item.id" @click="goToListen(item.id)">
<text>{{item.name}}</text><u-icon name="volume" color="#71d5a1" size="24">立即试听</u-icon>
<view class="item flexbox" v-for="item in listenList" :key="item.id" style="vertical-align: middle;">
<text style="margin-top: 10rpx; padding-right: 10rpx;">{{item.name}}</text>
<u-icon v-if="item.canListen == 'true'" name="volume" color="#71d5a1" size="24" @click="goToListen(item.id)"></u-icon>
<u-icon v-else name="volume" color="#71d5a1" size="24" @click="goToListenNone(item.id)"></u-icon>
</view>
</view>
<view class="bookInfo" >
@@ -294,6 +296,12 @@
this.goPurse()
}
},
goToListenNone(){
uni.showToast({
title:'该书暂未生成音频内容，敬请期待！',
icon:'none'
})
},
// 加入购物车
addCart() {
if (this.productInfo.productStock == 0) {
@@ -466,7 +474,7 @@ formatRichText (html) { //控制小程序中图片大小
.tingshuList{margin-top: 20rpx; background-color: #fff; padding: 20rpx;
border-radius: 20rpx; margin-bottom: 20rpx; padding-top: 40rpx;
background-image: linear-gradient(0deg, #f7fffc 0%, #def0ea 100%);
.item{margin-bottom: 20rpx;}
.item{margin-bottom: 20rpx; vertical-align: middle; }
h4{color: #5fb386; font-size: 40rpx; margin-bottom: 20rpx;}
text{color: #444; font-size: 32rpx; padding-left: 20rpx;}
}

29
pages/bookShop/orderLCont.vue
View File

@@ -49,14 +49,13 @@
</view>
<br clear="both">
</view>
<!-- <view class="orderOper" v-if="orderContet.orderStatus=='3'"> -->
<view class="orderOper" >
<view style="width: 100%; text-align: right;">
<view @click.stop="pingji(item.productId)" class="opCan" >评价</view>
<view @click.stop="showZhuiping(item.productId)" class="opCan" >追评</view>
<view v-if="userRecordid == null" @click.stop="pingji(item.productId)" class="opCan" >评价</view>
<view v-else @click.stop="showZhuiping(item.productId)" class="opCan" >追评</view>
</view>
</view>
<br clear="both">
</view>
@@ -183,6 +182,7 @@
export default {
data() {
return {
userRecordid:null, // 用户的评价状态
playData:{},
title: 'Hello',
isShowEmj: false,
@@ -197,6 +197,7 @@
img:[],
html:''
},
pingID:null,
productID:null, // 订单商品id
imageStyles:{
width:64,
@@ -267,11 +268,12 @@
this.pjType = 'zhuiping'
this.pingjiaShow = true
this.productID = val
this.pingID = pingid
},
// 追加评论
zhuiping(){
let data = {
//'oid':'',
'oid': this.userRecordid,
'userId': this.userInfo.id,
'bookid': this.productID,
'conTent': this.Pform.comment
@@ -287,15 +289,21 @@
}).then(res => {
if (res.code == 0) {
uni.showToast({
title:'成功！',
title:'追评成功！',
icon:'success'
})
this.pingjiaShow = false
this.pjType = ''
this.productID = null,
this.userRecordid = null
this.Pform.comment = ''
this.Pform.html = ''
this.emoji = []
setTimeout(()=>{
uni.navigateBack({
delta:1
})
},2000)
}
})
},
@@ -429,6 +437,11 @@
this.Pform.comment = ''
this.Pform.html = ''
this.emoji = []
setTimeout(()=>{
uni.navigateBack({
delta:1
})
},2000)
}
})
}else{
@@ -505,11 +518,13 @@
},
// 获取订单列表
getOrderList() {
console.log('this.orderType',this.orderType)
this.$http
.post(`book/buyorder/appGetOrderInfo/${this.orderType}?orderId=${this.orderID}`)
.then(res => {
console.log(res,'res')
console.log('res+++',res)
this.orderContet = res.buyOrder
this.userRecordid = res.userRecordid
this.productIDs = res.buyOrder.products.map(item => {
return item.productId
})

3
pages/bookShop/settlementBook.vue
View File

@@ -292,7 +292,8 @@
// this.getYunFei()
},
onShow() {
onShow() {
console.log('进来了这个页面')
this.getProid()
// return false
// if (this.typeId == 1) {

301
pages/clock/clock.vue
View File

@@ -1,5 +1,5 @@
<template>
<view class="container">
<view :class="['container', currentDay == linshiDay ? 'mb50':'']">
<z-nav-bar title="读书打卡"></z-nav-bar>
<!-- 仿钉钉打卡日历组件 -->
<view class="calendar_container">
@@ -15,24 +15,40 @@
<text>今天已签到</text>
</view>
</view>
<scroll-view class="scroll-view_H flexbox" scroll-x="true" @scroll="scroll" :scroll-left="scrollLeft">
<view class="" style="padding: 0 6rpx; display: inline-block; width: 20%; box-sizing: border-box; " v-for="(item,index) in 365">
<!-- <scroll-view class="scroll-view_H flexbox" scroll-x="true" @scroll="scroll" :scroll-left="scrollLeft">
<view class="" style="padding: 0 6rpx; display: inline-block; width: 20%; box-sizing: border-box; " v-for="(item,index) in 365">
<view
:class="['item', signList.indexOf(index+1) != -1 ? 'havSign' : '',
currentDay == index+1 && signList.indexOf(index+1) == -1 ? 'current' : '',
linshiDay == index+1 ? 'linshiDay':'']" @click="getInfo(index+1)">
<span class="day">第 <em>{{index+1}}</em> 天</span>
<span class="day"><em>{{index+1}}</em> 天</span>
<u-icon v-if="signList.indexOf(index+1) != -1" name="checkbox-mark" color="#fff" size="28" style="margin: 0 auto; width: 28px; text-align: center;"></u-icon>
<span v-if="signList.indexOf(index+1) == -1 && currentDay > index+1" class="buka">未签</span>
<span v-if="currentDay < index+1" class="weidaka">未开始</span>
<span v-if="currentDay == index+1 && signList.indexOf(index+1) == -1" class="daka" @click="kuickSign()">签到</span>
</view>
</view>
</scroll-view>
</scroll-view> -->
<swiper class="swiper scroll-view_H" :current='currentIndex' :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval"
:duration="duration">
<swiper-item v-for="(item,index) in dayList" :key="index" class="flexbox swiperPage">
<!-- <view class="swiper-item item" v-for="(item1,index1) in item" :key=""><span class="day">第 <em>{{item1}}</em> 天</span></view> -->
<view v-for="(item1,index1) in item" :key="index1"
:class="['item','swiper-item', signList.indexOf(item1) != -1 ? 'havSign' : '',
currentDay == item1 && signList.indexOf(item1) == -1 ? 'current' : '',
linshiDay == item1 ? 'linshiDay':'']" @click="getInfo(item1)">
<span class="day">第 <em>{{item1}}</em> 天</span>
<u-icon v-if="signList.indexOf(item1) != -1" name="checkbox-mark" color="#fff" size="28" style="margin: 0 auto; width: 28px; text-align: center;"></u-icon>
<span v-if="signList.indexOf(item1) == -1 && currentDay > item1" class="buka">未签</span>
<span v-if="currentDay < item1" class="weidaka">未开始</span>
<span v-if="currentDay == item1 && signList.indexOf(item1) == -1" class="daka" @click="kuickSign()">签到</span>
</view>
</swiper-item>
</swiper>
</view>
<view class="container1">
<view class="task" v-if="taskInfo !== {}">
<view class="title" v-if="taskInfo.heading">
<view class="task" v-if="taskInfo.id" >
<view class="title" >
{{taskInfo.heading}}
</view>
<view class="video " v-if="taskInfo.video">
@@ -46,49 +62,36 @@
<view class="image " v-if="taskInfo.images">
<!-- 图片形式的任务 -->
<image :src="taskInfo.images" style="width: 100%;" mode="aspectFit"></image>
</view>
<!-- <view class="voice ">
音频形式的任务
<audio style="text-align: center; width: 100%;" :src="currentAudio.src"
:poster="currentAudio.poster" :name="currentAudio.name" :author="currentAudio.author"
:action="audioAction" controls></audio>
</view> -->
</view>
<view class="txt" v-if="taskInfo.content" v-html="taskInfo.content"></view>
</view>
<view class="subContent">
<view v-else>
<u-divider text="今天未发布打卡任务"></u-divider>
</view>
<view :class="['subContent']" v-if="myword.length > 0">
<text class="clockTitle">-- 我的签到 --</text>
<!-- 未打卡 -->
<!-- 已打卡 -->
<view class="had" v-if="show">
<view class="item">
<h3>#第三课：专业变现：你的专业 = 超级杠杆！ 第一笔只是财富#</h3>
<view class="content">
借我一个暮年，借我碎片，
借我瞻前与顾后，借我执拗如少年。
借我后天长成的先天，借我变如不曾改变。
借我素淡的世故和明白的愚，借我可预知的险。
借我悲怆的磊落，借我温软的鲁莽和玩笑的庄严。
借我最初与最终的不敢，借我不言而喻的不见。
借我一场秋啊，可你说这已是冬天。
<view class="had" >
<view class="item" v-for="(item, index) in myword" :key="index">
<h3>#{{item.TaskHeading}}#</h3>
<view class="content" v-html="item.phtml">
</view>
<view class="images flexbox">
<image @click="previewImage()"
src="https://picx.zhimg.com/70/v2-92392172531ba8e252e3f9afaa4232d2_1440w.awebp?source=172ae18b&biz_tag=Post"
mode="aspectFill"></image>
<image
src="https://picx.zhimg.com/70/v2-92392172531ba8e252e3f9afaa4232d2_1440w.awebp?source=172ae18b&biz_tag=Post"
mode="aspectFill"></image>
<view class="pjimgs flexbox">
<view class="item" v-for="(item1,index) in item.clockinimages">
<image v-if="item1.length > 10" @click="previewImage(item1)" :src="item1" mode="aspectFill" style="width:100%; height: 50px;"></image>
</view>
</view>
<view class="opBtns flexbox">
<span class="flexbox"><u-icon name="clock" color="#b3b3b3"></u-icon>2023-08-23 14:01</span>
</view>
</view>
</view>
</view>
</view>
<!-- 他人的打卡记录 -->
<view class="" v-if="commentsList && commentsList.length > 0">
<view class="pingjiaBox" v-for="(item, index) in commentsList" :key="index">
<view class="allComments" v-if="commentsList && commentsList.length > 0">
<text class="clockTitle">-- 更多签到记录 --</text>
<view :class="['pingjiaBox']" v-for="(item, index) in commentsList" :key="index">
<view class="flexbox">
<view class="touxiang">
<image :src="item.avatar" mode="aspectFit"></image>
@@ -96,7 +99,7 @@
</view>
<view class="contentBox">
<div class="pjimgs flexbox">
<view class="item" v-for="(item1,index) in item.images">
<view class="item" v-for="(item1,index) in item.images">
<image v-if="item1.length > 10" @click="previewImage(item1)" :src="item1" mode="aspectFill" style="width:100%; height: 50px;"></image>
</view>
@@ -106,7 +109,7 @@
</view>
</view>
<!-- 显示追平 -->
<view class="zhuiping item" v-if="item.zphtml != ''" style="padding-left: 50px;">
<!-- <view class="zhuiping item" v-if="item.zphtml != ''" style="padding-left: 50px;">
<h5 style="color: #dbdbdb; margin:10px;">追评内容：</h5>
<view class="flexbox">
<view class="contentBox">
@@ -114,12 +117,12 @@
<text class="time">{{item.followUpdate}}</text>
</view>
</view>
</view>
</view> -->
</view>
</view>
<view class="quesheng" v-else>
<!-- <view class="quesheng" v-else>
<text>暂无评价~</text>
</view>
</view> -->
</view>
<u-popup mode="bottom" :show="addTextShow" :round="10" @close="addTextShow=false">
<view class="tanchu">
@@ -154,7 +157,7 @@
</view>
</u-popup>
<view class="leaveBtn" v-if="!addTextShow">
<view class="leaveBtn" v-if="!addTextShow && currentDay == linshiDay">
<button type="primary" plain="true" @click="addTextShow = true">说点什么</button>
</view>
<music-play :playData="playData"></music-play>
@@ -163,6 +166,7 @@
</template>
<script>
import emojiList1 from '../../bkhumor-emojiplus/emoji/biaoqin.js'
import $http from '@/config/requestConfig.js';
import emotion from '@/bkhumor-emojiplus/components/bkhumor-emojiplus/bkhumor-emojiplus.vue';
import zsyCalendar from '@/components/zsy-calendar/zsy-calendar'
@@ -174,17 +178,25 @@
export default {
data() {
return {
currentIndex:0,
dayList:[],
indicatorDots: false,
autoplay: false,
interval: 2000,
duration: 500,
commentsList:[], // 他人的打卡列表
addTextShow: false, // 说点什么弹出层
show: false,
scrollLeft: 0, // 距离左侧的距离
currentDay:1, // 当前打卡位置
currentDay:0, // 当前打卡位置
currentTid:null, // 今天的任务id
emojiIcon: 'cuIcon-emoji',
windowWidth: 0,
taskInfo:{
id:null,
heading:''
},
list3:[], // 时间日期
emoji: [],
signList:[], // 已打卡天
linshiDay:null,
@@ -196,10 +208,12 @@
videoContext: null,
innerAudioContext: null, // 音频对象
poster: '',
myword:[], // 我的打卡内容
formData: {
// 打卡表单
content: '',
images: []
images: [],
imagesStr: []
},
currentAudio: {
poster: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/music-a.png',
@@ -223,8 +237,10 @@
},
onLoad(e) {
this.bookid = e.bookid
this.windowWidth = uni.getSystemInfoSync().windowWidth;
this.getmySign()
this.windowWidth = uni.getSystemInfoSync().windowWidth;
this.initDay()
this.getmySign()
},
onReady() {
this.videoContext = uni.createVideoContext('myVideo')
@@ -235,6 +251,26 @@
...mapState(['userInfo'])
},
methods: {
group(array, subGroupLength) {
let index = 0;
let newArray = [];
while(index < array.length) {
newArray.push(array.slice(index, index += subGroupLength));
}
return newArray;
},
// 初始化day
initDay(){
var listint = 1
var arr = []
var arr1 = []
for (var i= 1; i<=365; i++) {
arr.push(i)
}
arr1 = this.group(arr, 5)
this.dayList = arr1
// console.log(arr1,'+++++++++++++')
},
// 放大图片
previewImage(url){
console.log(url)
@@ -252,10 +288,12 @@
.post('book/clockinPunch/clockindays', data)
.then(res => {
if (res.code == 0) {
this.currentDay = res.daysBetween
this.currentDay = res.daysBetween
this.linshiDay = res.daysBetween
this.signList = res.dayslist
console.log(res, '打卡参数')
let zheng = Math.floor(this.currentDay / 5)
this.currentIndex = zheng
let yu = this.currentDay % 5
if(this.currentDay <=5){this.scrollLeft = 0}
@@ -265,14 +303,44 @@
}
if(zheng > 1 && yu == 0){
this.scrollLeft = (this.windowWidth - 30) * (zheng - 1)
this.currentIndex -= 1
}
// console.log(zheng, yu, this.scrollLeft, this.windowWidth, 'this.scrollLeft')
this.getTask(this.currentDay)
this.getAllSign(this.currentDay)
}
});
},
// 获取当天我的发布内容
getmyWord(){
this.$http
.post('book/clockin/myinfolist?userid='+this.userInfo.id+'&taskid='+ this.taskInfo.id + '&bookid='+this.bookid)
.then(res => {
console.log(res,'当天我的打卡内容')
if(res.code == 0 && res.productlist.length > 0 ){
var arr = []
res.productlist.forEach((item1)=>{
var pjstr = ''
var imgs = []
imgs = item1.clockinimages.split(',')
pjstr = this.getHtmlComment(item1.content)
item1.clockinimages = imgs
item1.phtml = pjstr
arr.push(item1)
})
this.myword = arr
// console.log(this.myword,'this.myword')
}else{
this.myword = []
}
})
.catch(e => {
console.log(e)
})
},
// 获取签到详情
getInfo(index){
if(this.currentDay < index){
@@ -281,32 +349,52 @@
icon: 'none'
})
}else{
this.linshiDay = index
this.getTask(index)
this.getAllSign(index)
this.linshiDay = index
this.getTask(index)
}
},
// 获取某天的签到列表信息
getAllSign(index){
getAllSign(val){
console.log(val,'-----------')
let data = {
'bookid': this.bookid,
'limit': 5,
'page': this.page,
'taskid': index
'taskid': val.id
}
console.log(data)
this.$http
.post('book/clockin/applist', data)
.then(res => {
if (res.code == 0) {
console.log(res, '所有人打卡信息')
this.commentsList = res.page.list
if(res.list.length > 0){
var arr = res.list
for (var i=0; i<arr.length; i++) {
var arr1 = []
var pjstr = ''
// console.log(arr[i].content,'arr[i].content')
pjstr = this.getHtmlComment(arr[i].content)
// console.log(pjstr,'pjstr')
arr1 = arr[i].images.split(',')
arr[i].images = arr1
arr[i].phtml = pjstr
// console.log(arr1,'arr1')
}
// console.log(arr,'res.page.list')
this.commentsList = arr
}else{
this.commentsList = []
}
}
});
},
// 获取对应签到内容
getTask(index){
uni.showLoading()
let data = {
'bookid': this.bookid,
'days': index
@@ -317,22 +405,32 @@
.then(res => {
if (res.code == 0) {
console.log(res, '任务信息')
if(res.page.list.length > 0){
this.taskInfo = res.page.list[0]
this.taskInfo.video != ''? this.poster = this.taskInfo.video + "?x-oss-process=video/snapshot,t_0,f_jpg" : ''
this.getmyWord()
this.getAllSign(this.taskInfo)
}else{
this.taskInfo = {}
this.poster = ''
}
}
uni.hideLoading()
});
}).catch(e => {
uni.hideLoading()
})
},
// 快捷签到
kuickSign(){
console.log()
let data = {
"bookId": this.bookid,
"userId": this.userInfo.id,
"tid": this.taskInfo.id,
"days":this.currentDay
}
// console.log(data,'data')
$http.request({
url : 'book/clockinPunch/save',
method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档
@@ -344,13 +442,13 @@
if (res.code == 0) {
//console.log(res, '快捷签到')
uni.showToast({
title:res.msg
title:'签到成功'
})
this.addTextShow = false
this.formData.content = ''
this.formData.images = []
this.getmySign()
this.getAllSign(this.currentDay)
this.getAllSign(this.taskInfo)
}
});
@@ -360,20 +458,16 @@
let data = {
'bookId': this.bookid,
"userId": this.userInfo.id,
"taskId": this.currentDay,
"taskId": this.taskInfo.id,
"dayId": this.currentDay,
"content": this.formData.content,
"images": this.formData.images.join(),
}
// console.log(data,'data')
var surl = ''
if(this.signList.indexOf(this.currentDay) != -1){
surl='book/clockin/update'
}else{
surl = 'book/clockin/save'
}
// "images": this.formData.imagesStr.join(),
"imageeStrings": this.formData.images,
}
console.log(data,'data')
$http.request({
url : surl,
url : 'book/clockin/save',
method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档
data,
header: { //默认 无 说明：请求头
@@ -383,13 +477,15 @@
if (res.code == 0) {
//console.log(res, '快捷签到')
uni.showToast({
title:res.msg
title:'发布成功'
})
this.addTextShow = false
this.formData.content = ''
this.formData.images = []
this.formData.imagesStr = []
this.getmySign()
this.getAllSign(this.currentDay)
this.getTask()
}
});
@@ -450,7 +546,7 @@
// 处理格式
getHtmlComment(comment) {
// 格式化html
// 这里处理 链接 换行符
// 这里处理 链接 换行符
let replacedStr = comment.replace(/\[([^(\]|\[)]*)\]/g, (item, index) => {
// console.log(item, index)
var indexss = emojiList1.findIndex(item1 => item1.alt === item)
@@ -491,7 +587,8 @@
success: (res) => {
that.formData.images.push({
url: JSON.parse(res.data).url
})
})
console.log(that.formData.images,'that.formData.images')
}
});
}
@@ -518,6 +615,21 @@
</script>
<style lang="scss" scoped>
.pjimgs{ margin: 10px 0;flex-wrap: wrap; display: flex;
.item{width: 23%; margin-right: 10px;
image{ }
}
}
.contentBox{width: calc(100% - 50px);box-sizing: border-box; padding-left: 20rpx;
.content{font-size: 28rpx; line-height: 40rpx;}
.time{font-size: 24rpx; color: #999; margin-top: 6rpx; float: right;}
}
.touxiang{width:50px; overflow: hidden; text-align: center;
image{width:50px !important; padding: 3px; height: 50px !important; border: 1px solid #eee; border-radius: 64px; overflow: hidden;;}
.username{font-size: 24rpx; color: #999; margin-top: 6rpx; }
}
.allComments{ background-color: #fff; margin-top: 20rpx; padding: 20rpx; margin-bottom: 40rpx; }
.quesheng{text-align: center; margin-top: 100rpx; color: #8b8a91;}
.haveSignText{color: #999 ;}
.calendar_info {
@@ -537,11 +649,13 @@
.scroll-view_H {
white-space: nowrap;
margin: 20px 0;
margin: 20px 0; height: 120rpx !important;
width: 100%;
.item {
.swiperPage{ justify-content: space-between; height: 120rpx !important;}
.item { box-sizing: border-box;
width: calc(20% - 12rpx) !important;
border: 1px dashed #999;
height: 120rpx;
width: calc(100% - 6rpx);
// margin: 0 6rpx;
text-align: center;
@@ -555,7 +669,7 @@
color: #999;
em {
font-size: 36rpx;
font-size: 30rpx;
font-style: normal;
font-weight: bold;
padding-right: 2px;
@@ -567,6 +681,7 @@
}
.buka {
font-size: 24rpx;
display: inline-block; padding: 0 6rpx;
color: #888;
// border: 1px solid #888;
@@ -577,12 +692,13 @@
.weidaka {
color: #A3B4B5;
margin: 10px 0; font-size: 24;
margin: 10px 0; font-size: 24rpx;
border-radius: 20rpx;
margin-bottom: 0;
display: block;
}
.daka{
font-size: 24rpx;
display: inline-block; padding: 0 6rpx;
border: 1px solid #55aaff;
color: #55aaff;
@@ -600,13 +716,13 @@
display: inline-block;
background-color: #55aa7f;
border-radius: 20rpx;
padding: 6px 6px;
padding: 6px 3px;
.day {
font-size: 26rpx;
color: #fff;
em {
font-size: 32rpx;
font-size: 30rpx;
font-style: normal;
font-weight: bold;
padding-right: 2px;
@@ -625,11 +741,12 @@
background-color: #edf9ff;
border-radius: 20rpx;
padding: 6px 6px;
.day {
font-size: 26rpx;
color: #55aaff;
em {
font-size: 32rpx;
font-size: 30rpx;
font-style: normal;
font-weight: bold;
padding-right: 2px;
@@ -637,6 +754,9 @@
}
}
.item.linshiDay{
.daka{
color: #fff; border-color:#fff;
}
border: 1px solid #55aaff;
text-align: center;
@@ -714,15 +834,15 @@
background-color: #fff;
overflow: hidden;
.clockTitle {
}
.clockTitle {
color: #55aa7f;
font-size: 38rpx;
text-align: center;
display: block;
margin-top: 30rpx;
margin-top: 30rpx; margin-bottom: 30rpx;
}
}
.container1 {
.margin-top {
margin-top: 30rpx;
@@ -841,4 +961,5 @@
.flexbox {
display: flex;
}
.mb50{margin-bottom: 50rpx;}
</style>

393
pages/clock/clockList - 副本.vue Normal file
View File

@@ -0,0 +1,393 @@
<template>
<view class="container">
<z-nav-bar title="打卡记录"></z-nav-bar>
<view class="calendar_container">
<zsy-calendar :mode="mode" @change="change" />
</view>
<view class="container1">
<view class="subContent">
<!-- 已打卡 -->
<view class="had">
<view class="item flexbox">
<view class="dateName flexbox">
<span>第<em>365</em>天</span>
</view>
<view class="bookinfo">
<view class="case">
<view class="book flexbox">
<image src="../../static/icon/x1.jpg" mode="aspectFill"></image>
<view class="clockInfo">
<span>中医免疫学</span>
<h3>#第三课：专业变现：你的专业 = 超级杠杆！ 第一笔只是财富#</h3>
</view>
</view>
<view class="content">
借我一个暮年，借我碎片，
借我瞻前与顾后，借我执拗如少年。
借我后天长成的先天，借我变如不曾改变。
借我素淡的世故和明白的愚，借我可预知的险。
借我悲怆的磊落，借我温软的鲁莽和玩笑的庄严。
借我最初与最终的不敢，借我不言而喻的不见。
借我一场秋啊，可你说这已是冬天。
<view class="images flexbox">
<image @click="previewImage()"
src="https://picx.zhimg.com/70/v2-92392172531ba8e252e3f9afaa4232d2_1440w.awebp?source=172ae18b&biz_tag=Post"
mode="aspectFill"></image>
<image
src="https://picx.zhimg.com/70/v2-92392172531ba8e252e3f9afaa4232d2_1440w.awebp?source=172ae18b&biz_tag=Post"
mode="aspectFill"></image>
</view>
<view class="opBtns flexbox">
<span class="flexbox"><u-icon name="clock" color="#b3b3b3"></u-icon>2023-08-23
14:01</span>
</view>
<span class="viewMore"><u-icon style="display: inline-block;" name="arrow-down"
color="#409eff"></u-icon>查看全部</span>
</view>
</view>
<view class="case">
<view class="book flexbox">
<image src="../../static/icon/x1.jpg" mode="aspectFill"></image>
<view class="clockInfo">
<span>中医免疫学</span>
<h3>#第三课：专业变现：你的专业 = 超级杠杆！ 第一笔只是财富#</h3>
</view>
</view>
<view class="content">
借我一个暮年，借我碎片，
借我瞻前与顾后，借我执拗如少年。
借我后天长成的先天，借我变如不曾改变。
借我素淡的世故和明白的愚，借我可预知的险。
借我悲怆的磊落，借我温软的鲁莽和玩笑的庄严。
借我最初与最终的不敢，借我不言而喻的不见。
借我一场秋啊，可你说这已是冬天。
<view class="images flexbox">
<image @click="previewImage()"
src="https://picx.zhimg.com/70/v2-92392172531ba8e252e3f9afaa4232d2_1440w.awebp?source=172ae18b&biz_tag=Post"
mode="aspectFill"></image>
<image
src="https://picx.zhimg.com/70/v2-92392172531ba8e252e3f9afaa4232d2_1440w.awebp?source=172ae18b&biz_tag=Post"
mode="aspectFill"></image>
</view>
<view class="opBtns flexbox">
<span class="flexbox"><u-icon name="clock" color="#b3b3b3"></u-icon>2023-08-23
14:01</span>
</view>
<span class="viewMore"><u-icon style="display: inline-block;" name="arrow-down"
color="#409eff"></u-icon>查看全部</span>
</view>
</view>
</view>
</view>
<view class="item flexbox">
<view class="dateName flexbox">
<span>第<em>36</em>天</span>
</view>
<view class="bookinfo">
<view class="case">
<view class="book flexbox">
<image src="../../static/icon/x1.jpg" mode="aspectFill"></image>
<view class="clockInfo">
<span>中医免疫学</span>
<h3>#第三课：专业变现：你的专业 = 超级杠杆！ 第一笔只是财富#</h3>
</view>
</view>
<view class="content">
借我一个暮年，借我碎片，
借我瞻前与顾后，借我执拗如少年。
借我后天长成的先天，借我变如不曾改变。
借我素淡的世故和明白的愚，借我可预知的险。
借我悲怆的磊落，借我温软的鲁莽和玩笑的庄严。
借我最初与最终的不敢，借我不言而喻的不见。
借我一场秋啊，可你说这已是冬天。
<view class="images flexbox">
<image @click="previewImage()"
src="https://picx.zhimg.com/70/v2-92392172531ba8e252e3f9afaa4232d2_1440w.awebp?source=172ae18b&biz_tag=Post"
mode="aspectFill"></image>
<image
src="https://picx.zhimg.com/70/v2-92392172531ba8e252e3f9afaa4232d2_1440w.awebp?source=172ae18b&biz_tag=Post"
mode="aspectFill"></image>
</view>
<view class="opBtns flexbox">
<span class="flexbox"><u-icon name="clock" color="#b3b3b3"></u-icon>2023-08-23
14:01</span>
</view>
<span class="viewMore"><u-icon style="display: inline-block;" name="arrow-down"
color="#409eff"></u-icon>查看全部</span>
</view>
</view>
<view class="case">
<view class="book flexbox">
<image src="../../static/icon/x1.jpg" mode="aspectFill"></image>
<view class="clockInfo">
<span>中医免疫学</span>
<h3>#第三课：专业变现：你的专业 = 超级杠杆！ 第一笔只是财富#</h3>
</view>
</view>
<view class="content">
借我一个暮年，借我碎片，
借我瞻前与顾后，借我执拗如少年。
借我后天长成的先天，借我变如不曾改变。
借我素淡的世故和明白的愚，借我可预知的险。
借我悲怆的磊落，借我温软的鲁莽和玩笑的庄严。
借我最初与最终的不敢，借我不言而喻的不见。
借我一场秋啊，可你说这已是冬天。
<view class="images flexbox">
<image @click="previewImage()"
src="https://picx.zhimg.com/70/v2-92392172531ba8e252e3f9afaa4232d2_1440w.awebp?source=172ae18b&biz_tag=Post"
mode="aspectFill"></image>
<image
src="https://picx.zhimg.com/70/v2-92392172531ba8e252e3f9afaa4232d2_1440w.awebp?source=172ae18b&biz_tag=Post"
mode="aspectFill"></image>
</view>
<view class="opBtns flexbox">
<span class="flexbox"><u-icon name="clock" color="#b3b3b3"></u-icon>2023-08-23
14:01</span>
</view>
<span class="viewMore"><u-icon style="display: inline-block;" name="arrow-down"
color="#409eff"></u-icon>查看全部</span>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<music-play :playData="playData"></music-play>
<z-navigation></z-navigation>
</view>
</template>
<script>
import zsyCalendar from '@/components/zsy-calendar/zsy-calendar'
import musicPlay from '@/components/music.vue'
import {
mapState
} from 'vuex';
export default {
data() {
return {
playData: {},
mode: 'open',
status : 0
}
},
// 返回顶部
onPageScroll(e) {
this.scrollTop = e.scrollTop;
},
// 下拉刷新
onReachBottom() {
this.status = 0
if (this.bookScreen.page < this.totalPage) {
this.bookScreen.page = this.bookScreen.page + 1
setTimeout(() => {
this.$http
// .post('book/book/list', this.bookScreen)
.post('book/shopproduct/selectList?limit=8&page=1&key='+this.bookScreen.bookName)
.then(res => {
this.totalPage = res.page.totalPage
for (let i in res.page.list) {
this.bookList.push(res.page.list[i])
}
});
}, 1000)
} else {
this.status = 1
}
},
onLoad() {
this.getmyWord()
},
methods: {
change(e) {
console.log(e)
},
getmyWord(){
this.$http
.post('book/clockin/myinfo?userid='+this.userInfo.id)
.then(res => {
console.log(res,'我的打卡内容')
})
.catch(e => {
console.log(e)
})
},
},
components: {
musicPlay,
zsyCalendar
},
computed:{
...mapState(['userInfo'])
}
}
</script>
<style lang="scss" scoped>
.listenList{
.wrap{width: 150rpx;}
}
.task {
margin-top: 40rpx 20rpx;
.taskinfo {
video {
width: 100%;
}
}
}
.subContent {
overflow: hidden;
.clockTitle {
color: #55aa7f;
font-size: 38rpx;
text-align: center;
display: block;
margin-top: 30rpx;
}
}
.container1 {
.margin-top {
margin-top: 30rpx;
overflow: hidden;
}
}
.container {
padding: 30rpx;
}
.calendar_container {
//min-height: calc(60vh);
background-color: #f5f5f5;
//padding: 30rpx;
box-sizing: border-box;
}
.had {
margin-top: 30rpx;
h3 {
color: #8c9a92;
font-size: 34rpx;
}
.content {
line-height: 60rpx;
margin-top: 30rpx;
font-size: 30rpx;
color: #0e0e15;
}
.images {
height: 150rpx;
overflow: hidden;
margin-top: 30rpx;
image {
width: 150rpx;
margin: 0 10rpx;
}
}
.opBtns {
margin-top: 30rpx;
span {
color: #b3b3b3;
padding-left: 20rpx;
font-size: 24rpx;
}
}
.item {
padding-left: 20rpx;
margin-bottom: 40rpx;
background-color: #fff;
justify-content: space-between;
.dateName {
color: #444;
text-align: center;
align-items: center;
width: 80rpx;
padding-right: 20rpx;
border-right: 1px solid #eee;
span {
display: inline-block;
height: 120rpx;
padding: 20rpx 0;
border-radius: 50rpx;
width: 100%;
background-color: #d9e8f7;
text-align: center;
em {
font-weight: bold;
font-style: normal;
}
}
}
.bookinfo {
text-align: center;
// width: 100%;
// padding: 20rpx;
margin-left: 20rpx;
.case{ margin-top:60rpx; background-color: #fff; padding: 20rpx;}
.content {
position: relative; padding-bottom: 60rpx; height: 60px; overflow: hidden;
}
.book {
image {
width:200rpx;
height: 150rpx;
margin: 0 auto;
}
.clockInfo{text-align: left; margin-left: 20rpx;}
span {
color: #444;
display: block;
font-weight: bold;
margin-bottom: 20rpx;
}
}
}
}
}
.viewMore {
position: absolute;
bottom: 5rpx;
right: 0; color: #409eff;
z-index: 1; text-align: right;
width: 200rpx; background-image: url('@/static/icon/zuotouming.png'); background-position: right; background-size: cover; background-repeat: no-repeat;
}
.flexbox {
display: flex;
}
</style>

413
pages/clock/clockList.vue Normal file
View File

@@ -0,0 +1,413 @@
<template>
<view class="container">
<z-nav-bar title="我的打卡签到记录"></z-nav-bar>
<!-- <view class="calendar_container">
<zsy-calendar :mode="mode" @change="change" />
</view> -->
<view class="books">
<view class="" style="background-color: #fff; padding: 10rpx;">
<text style="font-size: 24rpx; color: #888;" v-if="bookList.length > 0">我的打卡书籍</text>
<text style="font-size: 24rpx; color: #888;" v-else>暂无可打卡书籍</text>
</view>
<scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll" :scroll-left="scrollLeft">
<view class="listenList flexbox" v-if="bookList.length > 0">
<view :class="['item', selectIndex == index ? 'active' : '']" v-for="(item,index) in bookList" :key="index">
<view class="videoBox" @click="selectOne(item.book,index)">
<image v-if="item.book.images != ''" :src="item.book.images" mode="scaleToFill"></image>
<image v-else src="../../static/icon/wufeng.jpg" mode="scaleToFill"></image>
</view>
<text class="bookName">{{item.book.name}}</text>
</view>
</view>
</scroll-view>
</view>
<view class="container1">
<view class="subContent" v-if="status==0">
<!-- 已打卡 -->
<view class="had" v-if="recordList.length> 0">
<view class="item">
<view class="bookinfo">
<view class="case" v-for="(item, index) in recordList" :key="index">
<view class="book flexbox" >
<!-- <image src="../../static/icon/x1.jpg" mode="aspectFill"></image> -->
<view class="clockInfo" >
<!-- <span>中医免疫学</span> -->
<h3><span class="day">第 <em>{{item.dayId}}</em> 天</span><br/>#{{item.TaskHeading}}#</h3>
</view>
</view>
<view :class="['content',item.zhankai ? 'active' : '']" >
<view class="texttt" v-html="item.phtml" ></view>
<view class="images flexbox" v-if="item.clockinimages.length>0">
<view class="box" v-for="(item1,index1) in item.clockinimages">
<image @click="previewImage(item1)"
:src="item1"
mode="aspectFill"></image>
</view>
</view>
<view class="opBtns flexbox">
<span class="flexbox"><u-icon name="clock" color="#b3b3b3"></u-icon>{{item.createTime}}</span>
</view>
<span class="viewMore" v-if="!item.zhankai" @click="changeHeight(item, index)">
<u-icon style="display: inline-block;" name="arrow-down"
color="#55aa00"></u-icon>
展开</span>
<span class="viewMore" v-else @click="changeHeight(item, index)">
<u-icon style="display: inline-block;" name="arrow-down"
color="#55aa00"></u-icon>
收起</span>
</view>
</view>
</view>
</view>
</view>
<view v-else>
<u-divider text="暂无打卡记录哦~"></u-divider>
</view>
</view>
<view v-if="status==1">
<u-divider text="全部加载完成"></u-divider>
</view>
<view style="padding-bottom: 20rpx;">
<u-back-top :scroll-top="scrollTop"></u-back-top>
</view>
</view>
<music-play :playData="playData"></music-play>
<z-navigation></z-navigation>
</view>
</template>
<script>
import emojiList1 from '../../bkhumor-emojiplus/emoji/biaoqin.js'
import zsyCalendar from '@/components/zsy-calendar/zsy-calendar'
import musicPlay from '@/components/music.vue'
import {
mapState
} from 'vuex';
export default {
data() {
return {
playData: {},
mode: 'open',
status: 0,
scrollLeft: 0,
recordList: [],
bookList: [],
scrollTop: 0,
bookinfo:{},
selectIndex:0
}
},
// 返回顶部
onPageScroll(e) {
this.scrollTop = e.scrollTop;
},
// 下拉刷新
onReachBottom() {
this.status = 0
},
onLoad() {
this.getfreeBook()
},
methods: {
selectOne(val,index){
// 点击某一个图书
uni.showLoading()
this.bookinfo = val
this.selectIndex = index
this.getmyWord()
},
scroll(e) {
},
// 获取打卡图书列表
getfreeBook() {
this.$http
.post('book/userebookbuy/appbooklist', {
'userId': this.userInfo.id,
'page': this.page,
'limit': 100
})
.then(res => {
if (res.code == 0) {
// this.ygtotalPage = res.resultlist.totalCount
if(res.resultlist.length > 0) {
this.bookList = res.resultlist
this.bookinfo = this.bookList[0].book
console.log(res, '已购买')
this.getmyWord()
// this.status = 3
}else{
this.bookList = []
}
}
});
},
change(e) {
console.log(e)
},
// 放大图片
previewImage(url){
console.log(url, 'url')
uni.previewImage({
urls: [url]
});
},
// 处理展开或者合并
changeHeight(val, index){
this.recordList[index].zhankai = !this.recordList[index].zhankai
},
// 处理格式
getHtmlComment(comment) {
// 格式化html
// 这里处理 链接 换行符
let replacedStr = comment.replace(/\[([^(\]|\[)]*)\]/g, (item, index) => {
// console.log(item, index)
var indexss = emojiList1.findIndex(item1 => item1.alt === item)
// console.log(indexss, 'indexss')
return '<img src="https://www.nuttyreading.com/emojis/emojis/qq/' + emojiList1[indexss].url +
'" width="18rpx">';
});
// console.log(replacedStr,'replacedStr')
return replacedStr.replace(/(\r\n)|(\n)/g, '<br>');
},
getmyWord() {
console.log(this.userInfo.id,this.bookinfo.id,'++++++++')
this.$http
.post('book/clockin/myinfo?userid=' + this.userInfo.id + '&bookid='+ this.bookinfo.id)
.then(res => {
console.log(res, '我的打卡内容')
if (res.code == 0 && res.ClockinList.length > 0) {
// this.recordList = res.ClockinList
var arr = []
res.ClockinList.forEach((item1)=>{
var pjstr = ''
var imgs = []
imgs = item1.clockinimages.split(',')
pjstr = this.getHtmlComment(item1.content)
item1.clockinimages = imgs
//console.log(pjstr,'99999999999----------')
item1.zhankai = false
item1.phtml = pjstr
arr.push(item1)
})
this.recordList = arr
} else {
this.recordList = []
}
uni.hideLoading()
})
.catch(e => {
console.log(e.msg)
uni.hideLoading()
})
},
},
components: {
musicPlay,
zsyCalendar
},
computed: {
...mapState(['userInfo'])
}
}
</script>
<style lang="scss" scoped>
.scroll-view_H{background-color: #fff; padding:10rpx }
.listenList { background-color: #fff; padding: 5rpx 0;
.item { padding: 10rpx; overflow: hidden;
width: 150rpx !important; margin-right: 20rpx; border: 1px solid #fff; border-radius: 10rpx;
.videoBox{
image{display: block; width:130rpx;
height: 170rpx;
}
}
.bookName{display: block; margin-top: 20rpx; color: #666; font-size: 24rpx; white-space: nowrap;
overflow-x: hidden; overflow: hidden;
text-overflow: ellipsis;}
}
.item.active{margin-right: 20rpx; border: 1px solid #55aa00; border-radius: 10rpx;}
}
.task {
margin-top: 40rpx 20rpx;
.taskinfo {
video {
width: 100%;
}
}
}
.subContent {
overflow: hidden;
.clockTitle {
color: #55aa7f;
font-size: 38rpx;
text-align: center;
display: block;
margin-top: 30rpx;
}
}
.container1 {
.margin-top {
margin-top: 30rpx;
overflow: hidden;
}
}
.container {
padding: 30rpx;
}
.calendar_container {
//min-height: calc(60vh);
background-color: #f5f5f5;
//padding: 30rpx;
box-sizing: border-box;
}
.had {
margin-top: 30rpx;
h3 {
color: #8c9a92;
font-size: 34rpx;
}
.content {
width: 100% !important; overflow: hidden;
line-height: 60rpx;
margin-top: 10rpx;
font-size: 30rpx;
color: #0e0e15;
.texttt{margin-top: 10rpx; text-align: left !important; word-wrap:break-word !important; word-break:break-all; width: 100%;
font-size: 30rpx;
color: #888;}
}
.images {
height: 150rpx;
overflow: hidden;
margin-top: 30rpx;
.box{
width: 150rpx;height: 150rpx; margin: 0 10rpx;
}
image {
width: 150rpx;
}
}
.opBtns {
margin-top: 30rpx;
span {
color: #b3b3b3;
padding-left: 20rpx;
font-size: 24rpx;
}
}
.item {
padding-left: 20rpx;
margin-bottom: 40rpx;
background-color: #fff;
justify-content: space-between;
.dateName {
color: #444;
text-align: center;
align-items: center;
width: 80rpx;
padding-right: 20rpx;
border-right: 1px solid #eee;
span {
display: inline-block;
height: 120rpx;
padding: 20rpx 0;
border-radius: 50rpx;
width: 100%;
background-color: #d9e8f7;
text-align: center;
em {
font-weight: bold;
font-style: normal;
}
}
}
.bookinfo {
text-align: center;
// width: 100%;
// padding: 20rpx;
margin-left: 20rpx;
.case {
margin-top: 30rpx;
background-color: #fff; padding-bottom: 30rpx !important;
padding:10rpx;
border-bottom: 1px solid #efefef; margin-bottom: 20rpx ;
}
.content {
position: relative;
padding-bottom: 60rpx;
height: 60px;
overflow: hidden;
}
.content.active{height: auto !important;}
.book {
image {
width: 200rpx;
height: 150rpx;
margin: 0 auto;
}
.clockInfo { margin-bottom: 10rpx;
text-align: left;
.day{ color: #55aa7f; margin-bottom: 20rpx ; font-size: 36rpx !important; display: inline; padding: 20rpx; border-radius: 10rpx;}
em{font-style: normal; font-size: 60rpx !important; padding: 0 10rpx;}
}
span {
color: #444;
display: block;
font-weight: bold;
margin-bottom: 20rpx;
}
}
}
}
}
.viewMore {
position: absolute;
bottom: 5rpx;
right: 0;
color: #55aa00;
z-index: 1;
text-align: right;
width: 200rpx;
background-image: url('@/static/icon/zuotouming.png');
background-position: right;
background-size: cover;
background-repeat: no-repeat;
}
.flexbox {
display: flex;
}
</style>

213
pages/clock/index.vue Normal file
View File

@@ -0,0 +1,213 @@
<template>
<view>
<z-nav-bar title="读书打卡"></z-nav-bar>
<view class="listenList" v-if="bookList.length > 0">
<view class="wrap" >
<u-row gutter="16" justify="flex-start">
<u-col span="4" v-for="(item,index) in bookList" :key="index">
<view class="videoBox demo-layout bg-purple" @click="goToClock(item.book)">
<image v-if="item.book.images != ''" :src="item.book.images" mode="scaleToFill" ></image>
<image v-else src="../../static/icon/wufeng.jpg" mode="scaleToFill" ></image>
</view>
<text class="bookName">{{item.book.name}}</text>
</u-col>
</u-row>
</view>
</view>
<music-play :playData="playData"></music-play>
<z-navigation></z-navigation>
</view>
</template>
<script>
import {
mapState
} from 'vuex';
import musicPlay from '@/components/music.vue'
export default {
data() {
return {
playData:{},
bookList:[],
page:1, // 页码
}
},
onLoad() {
this.getfreeBook()
},
methods: {
// 跳转到打卡页面
goToClock(val){
if(val.clockIn != 1){
uni.showModal({
title: '提示',
cancelText: '暂不购买',
confirmText:'立即购买',
content: '购买后才可参与本书打卡哦~',
success: function (res) {
if (res.confirm) {
console.log('点击了去购买');
}
}
});
}else{
console.log(val,'val')
this.onPageJump('../clock/clock?bookid='+val.id)
}
},
// 获取打卡图书
getfreeBook(){
this.$http
.post('book/userebookbuy/appbooklist', {
// .post('book/userebookbuy/buylist', {
// .post('book/buyorderdetail/querybuy', {
'userId': this.userInfo.id,
// 'page':this.page,
// 'limit':100
})
.then(res => {
if(res.code == 0){
//this.ygtotalPage = res.resultlist.totalCount
this.bookList = res.resultlist
console.log(res,'已购买')
this.status = 3
}
});
},
// 跳转
onPageJump(url) {
uni.navigateTo({
url: url
});
},
},
computed: {
...mapState(['userInfo'])
},
components: {
musicPlay,
}
}
</script>
<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;
}
.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;
}
.videoBox{position: relative;}
.playButton{position: absolute; z-index: 1; right: 4px; bottom: 4px; padding: 5px; border-radius: 100%; }
uni-image {
width:auto !important;
height: 350rpx;
}
.u-row{flex-wrap: wrap;}
.u-col{overflow: hidden; height: 250px; margin-bottom: 30rpx; }
.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;
}
.head_line {
margin: 50rpx 0;
b {
display: inline-block;
width: 12rpx;
height: 40rpx;
background-color: #54a966;
vertical-align: bottom;
margin: 0 20rpx 0 0;
}
text {
font-size: 32rpx;
font-weight: bold;
}
i {
float: right;
font-style: normal;
color: #8b8a91;
font-size: 24rpx;
margin: 5rpx 35rpx 0 0;
}
}
.home_bg {
background-image: url('@/static/icon/home_bg.jpg');
background-position: center center;
background-repeat: no-repeat;
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;
background-color: #fff;
border-radius: 32upx;
display: flex;
align-items: center;
padding: 0upx 40upx;
position: absolute;
margin-left: -46%;
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;
background-repeat: no-repeat;
background-size: cover;
width: 29upx;
height: 28upx;
margin-right: 20upx;
}
}
}
</style>

291
pages/library/library.vue
View File

@@ -2,21 +2,45 @@
<view>
<!-- 公共组件-每个页面必须引入 -->
<!-- <public-module></public-module> -->
<z-nav-bar title="我的图书"></z-nav-bar>
<view class="home_bg" >
<image src="../../static/icon/home_icon_1.png" mode="aspectFit" class="icon_hua_1"></image>
<view class="search_box" @click="onPageJump('./searchFor')">
<text class="icon_search"></text>
<text class="prompt">搜索...</text>
<!-- <z-nav-bar title="我的图书"></z-nav-bar> -->
<view class="home_bg " >
<view class="flexbox" style=" justify-content: space-between; ">
<view class="icon_hua">
<image src="../../static/icon/home_icon_3.png" mode="aspectFit" class="icon_hua_1"></image>
</view>
<view class="search_box flexbox" @click="onPageJump('../peanut/searchFor')">
<view class="search">
<text class="icon_search"></text>
<text class="prompt">请输入想要搜索的书名</text>
</view>
</view>
<view class="searBtn flexbox">
<text>搜索</text>
</view>
</view>
<view class="home_lunbo">
<u-swiper :list="list3" indicator indicatorMode="line" circular style="height: 180rpx;"></u-swiper>
</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>
</view> -->
<view class="" style="padding: 20rpx;">
<view class="mytabs flexbox">
<view :class="['item','item1', contentShow == 1 ? 'active' :'']" @click="setData(1)">
已购图书
</view>
<view :class="['item','item2', contentShow == 2 ? 'active' :'']" @click="setData(2)">
推荐图书
</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>
</view>
<view class="listenList" v-if="bookList.length > 0">
<view class="wrap" v-if="contentShow == 0">
<view class="wrap" v-if="contentShow == 1">
<u-row gutter="16" justify="flex-start">
<u-col span="6" v-for="(item,index) in bookList" :key="index">
<view >
<view class="flexbox listenItem">
<view class="info">
<view class="videoBox demo-layout bg-purple" @click="goToListenFree(item)">
@@ -25,11 +49,11 @@
</view>
<view class="btns">
<view class="item flexbox" @click="">
<!-- <u-icon name="bookmark" color="#55aaff" size="24"></u-icon> -->
<!-- <view class="item flexbox" @click="">
<u-icon name="bookmark" color="#55aaff" size="24"></u-icon>
<image src="../../static/icon/tu1.png" mode="aspectFit"></image>
<text >读 书</text>
</view>
</view> -->
<view class="item flexbox" @click="goToListenFree(item)">
<!-- <u-icon name="volume" color="#71d5a1" size="24"></u-icon> -->
<image src="../../static/icon/tu2.png" mode="aspectFit"></image>
@@ -42,35 +66,36 @@
</view>
</view>
</view>
<view class="bookName">{{item.bookName}}</view>
<view class="bookName">{{item.bookName}}</view>
</view>
</u-col>
</u-row>
</view>
<view class="wrap" v-if="contentShow == 1">
<view class="wrap" v-if="contentShow == 2">
<u-row gutter="16" justify="flex-start">
<u-col span="6" v-for="(item,index) in tjBookLIst" :key="index">
<view class="flexbox listenItem">
<view class="info">
<view class="videoBox demo-layout bg-purple" @click="goDetail(item)">
<image :src="item.productImages" mode="scaleToFill" ></image>
<view class="videoBox demo-layout bg-purple" @click="goDetail(item.product)">
<image :src="item.product.productImages" mode="scaleToFill" ></image>
</view>
</view>
<view class="btns">
<view class="item flexbox" @click="">
<view class="item flexbox" @click="goDetail(item.product)">
<image src="../../static/icon/tu1.png" mode="aspectFit"></image>
<text>读 书</text>
</view>
<view class="item flexbox" @click="goToListen(item)">
<view class="item flexbox" @click="goToListen(item.product)">
<image src="../../static/icon/tu2.png" mode="aspectFit"></image>
<text>听 书</text>
</view>
<view class="item flexbox" @click="wgGoPingshu(item)">
<view class="item flexbox" @click="wgGoPingshu(item.product)">
<image src="../../static/icon/tu3.png" mode="aspectFit"></image>
<text>评 书</text>
</view>
</view>
</view>
<view class="bookName">{{item.productName}}</view>
<view class="bookName">{{item.product.productName}}</view>
</u-col>
</u-row>
</view>
@@ -100,11 +125,16 @@
export default {
data() {
return {
list3: [
// '../../static/icon/home_ban_1.jpg',
'../../static/icon/home_ban_2.jpg',
'../../static/icon/home_ban_3.jpg',
],
showEbook:false,
playData:{},
loadingNow : false,
bookList:[],
contentShow:0,
contentShow:1,
page:1, // 页码
status: 3,
ygtotalPage:1,
@@ -127,13 +157,13 @@
onPullDownRefresh() {
console.log('下拉刷新了')
uni.stopPullDownRefresh();
if(this.contentShow == 0){
this.page=1, // 页码
if(this.contentShow == 1){
// this.page=1, // 页码
this.bookList = []
this.getfreeBook()
}
else if(this.contentShow == 1){
this.tjPage=1, // 页码
else if(this.contentShow == 2){
// this.tjPage=1, // 页码
this.tjBookLIst = []
this.getListDate()
}
@@ -142,33 +172,33 @@
this.loadingNow = true
console.log('到底了')
if(this.contentShow == 0){
//console.log(this.page , this.ygtotalPage)
if(this.page < this.ygtotalPage){
this.page++
console.log('加载',this.page)
this.status = 0
this.getfreeBook()
// if(this.contentShow == 1){
// //console.log(this.page , this.ygtotalPage)
// if(this.page < this.ygtotalPage){
// this.page++
// console.log('加载',this.page)
// this.status = 0
// this.getfreeBook()
}else{
this.status = 1
console.log('加载完成了',this.page)
return
}
// }else{
// this.status = 1
// console.log('加载完成了',this.page)
// return
// }
}else if(this.contentShow == 1){
if(this.tjPage < this.tjTotalPage){
this.tjPage++
console.log('加载',this.tjPage)
this.status = 0
this.getListDate()
// }else if(this.contentShow == 2){
// if(this.tjPage < this.tjTotalPage){
// this.tjPage++
// console.log('加载',this.tjPage)
// this.status = 0
// this.getListDate()
}else{
this.status = 1
console.log('加载完成了',this.tjPage)
return
}
}
// }else{
// this.status = 1
// console.log('加载完成了',this.tjPage)
// return
// }
// }
},
components:{
musicPlay
@@ -177,36 +207,24 @@
...mapState(['userInfo'])
},
methods: {
setData(e){
this.contentShow = e
},
// 未购买图书，评书跳转
wgGoPingshu(item){
console.log('未购买评书',item)
if(item.bookId == null || item.bookId.length <= 0){
//uni.showModal()
uni.showModal({
title: '提示',
showCancel:false,
content: '当前未关联图书信息，请联系联系管理员',
success: function (res) {
if (res.confirm) {
console.log('好的');
}
}
});
}else{
uni.navigateTo({
url: '../comments/comments?bookid='+item.bookId[0],
url: '../comments/comments?bookid='+item.bookId,
// url:'../bookShop/commodityDetail'
});
}
},
// 跳转到评书
goPingshu(val){
console.log('评书',val)
uni.navigateTo({
url: '../comments/comments?bookid='+val,
// url:'../bookShop/commodityDetail'
});
},
contentButtonClick(e){
@@ -214,6 +232,7 @@
},
// 获取已购买书籍
getfreeBook(){
console.log('获取已购买书籍')
this.$http
.post('book/userebookbuy/buylist', {
// .post('book/buyorderdetail/querybuy', {
@@ -224,8 +243,16 @@
.then(res => {
if(res.code == 0){
this.ygtotalPage = res.page.totalPage
this.bookList = this.bookList.concat(res.page.list)
// this.ygtotalPage = res.page.totalPage
//var arr = res.page
res.page.forEach(item => {
if(item.canListen){
this.bookList.push(item)
}
})
// console.log(this.bookList,'arr')
//this.bookList = arr
// this.bookList = this.bookList.concat(res.page.list)
console.log(res,'已购买')
this.status = 3
}
@@ -235,6 +262,7 @@
// 获取推荐图书（未购买）
getListDate(){
console.log('获取推荐图书（未购买）')
this.loadingNow = false
// 获取书架列表
this.$http
@@ -244,63 +272,52 @@
'page':this.tjPage
})
.then(res => {
console.log(res)
console.log(res,'获取推荐图书（未购买）')
if(res.code == 0){
this.tjTotalPage = res.pages.totalPage
// this.tjTotalPage = res.pages.totalPage
var arr = []
if(res.pages.list.length > 0){
for (var i=0; i<res.pages.list.length; i++ ) {
var booidArr = []
if(res.pages.list[i].bookId != null){
booidArr = res.pages.list[i].bookId.split(',')
//res.pages.list[i].bookId = booidArr
res.pages.list[i].bookId = booidArr
}else{
res.pages.list[i].bookId = []
}
}
console.log(res.pages.list,'res.pages.list')
// var arr = res.pages.list
this.tjBookLIst = this.tjBookLIst.concat(res.pages.list)
// console.log(res)
if(res.pages.length > 0){
// for (var i=0; i<res.pages.list.length; i++ ) {
// var booidArr = []
// if(res.pages.list[i].bookId != null){
// booidArr = res.pages.list[i].bookId.split(',')
// //res.pages.list[i].bookId = booidArr
// res.pages.list[i].bookId = booidArr
// }else{
// res.pages.list[i].bookId = []
// }
// }
//console.log(res.pages,'res.pages.list')
// var arr = res.pages.list
this.tjBookLIst = res.pages
// this.tjBookLIst = this.tjBookLIst.concat(res.pages.list)
// console.log(this.tjBookLIst[0])
this.status = 3
} }
});
},
// 跳转详情页
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){
//uni.showModal()
uni.showModal({
title: '提示',
showCancel:false,
content: '当前图书暂不支持试听',
success: function (res) {
if (res.confirm) {
console.log('好的');
}
}
});
}else{
goToListen(item){
console.log(item,'item')
uni.navigateTo({
url: "../listen/listen?bookid="+item.bookId[0]
url: "../listen/listen?bookid="+item.bookId
});
}
},
// 跳转到听书详情
goToListenFree(item){
console.log(item,'item')
// console.log(item,'item')
uni.navigateTo({
// url: "./musicbg?bookid="+item.bookid+"&fengImg="+item.image // 后台播放版本
url: "../listen/listen?bookid="+item.bookId+"&fengImg="+item.image // 前台播放版本
// url: "./bgMusix"
url: "../listen/listen?bookid="+item.bookId+"&fengImg="+item.image // 前台播放版本
});
},
// 跳转11
@@ -315,6 +332,22 @@
<style lang="scss" scoped>
@import '@/style/mixin.scss';
.home_lunbo {
margin: 40rpx 30rpx 0 30rpx;
}
.mytabs{
// background: url('@/static/icon/bgtushu.png') no-repeat left top;
height:110rpx ; margin-bottom: 50rpx;
.item{
border-radius: 10rpx;background-color: #adb6b7; width: 48%; margin: 0 10rpx; text-align: center; color:#fff ; font-size: 36rpx; line-height:110rpx ;
}
.item.active{
background-color: #73837b;
}
.item1{
background-color: #adb6b7;
}
}
.listenItem{
.btns{margin-top: 60rpx; margin-left: 20rpx; font-size: 34rpx; justify-content: space-between;
.item{ margin-bottom:30rpx;
@@ -398,35 +431,33 @@
}
}
.home_bg {
background-image: url('@/static/icon/home_bg.jpg');
background-image: url('@/static/icon/home_bg1.jpg');
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
padding: 100rpx 0 40rpx 0;
padding: 100rpx 20rpx 40rpx 20rpx;
position: relative;
height: 400rpx; margin-bottom: 130rpx;
.icon_hua_1 {
margin: 0 auto;
// margin: 0 auto;
width: 150rpx;
height: 150rpx;
}
.search_box {
width: 90%;
height: 64upx;
background-color: #fff;
border-radius: 32upx;
display: flex;
align-items: center;
padding: 0upx 40upx;
position: absolute;
margin-left: -46%;
left: 50%;
bottom: -40rpx;
box-shadow: 0 0px 10px 1px #54a96633;
.icon_hua{width: 150rpx; display: block;}
.search_box { margin-top: 20rpx; align-items: center;
width: calc(100% - 300rpx);
.search{height: 80upx;
display: flex;
width: 100%;
align-items: center;
padding: 0upx 40upx;
background-color: #fff;
border-radius: 20upx;
box-shadow: 0 0px 10px 1px #54a96633;
}
.prompt {
color: #cccccc;
color: #838383; font-size: 24rpx;
}
@@ -435,10 +466,14 @@
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
width: 29upx;
height: 28upx;
width:36upx;
height: 36upx;
margin-right: 20upx;
}
}
.searBtn{
width: 80rpx; align-items: center;
font-size: 30rpx; color: #fff;
}
}
</style>

111
pages/listen/home.vue
View File

@@ -17,32 +17,25 @@
<view class="wrap" v-if="contentShow == 0">
<u-row gutter="16" justify="flex-start">
<u-col span="4" v-for="(item,index) in bookList" :key="index">
<view>
<view class="videoBox demo-layout bg-purple" @click="goToListenFree(item)">
<image :src="item.image" mode="scaleToFill" ></image>
<u-icon class="playButton" name="play-circle" color="#54a966" size="28"></u-icon>
<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>
<text class="bookName">{{item.bookName}}</text>
<!-- <view class="btns flexbox">
<view class="item flexbox" @click="goToListenFree(item)">
<u-icon name="volume" color="#71d5a1" size="24"></u-icon>
<text>听 书</text>
</view>
<view class="item flexbox" @click="goPingshu(item.bookId)">
<u-icon name="chat" color="#fcbd71" size="24"></u-icon>
<text>评 书</text>
</view>
</view> -->
</u-col>
</u-row>
</view>
<view class="wrap" v-if="contentShow == 1">
<u-row gutter="16" justify="flex-start">
<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.productImages" mode="scaleToFill" ></image>
<u-icon class="playButton" name="play-circle" color="#54a966" size="28"></u-icon>
<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.productName}}</text>
<text class="bookName">{{item.product.productName}}</text>
<!-- <view class="btns flexbox">
<view class="item flexbox" @click="goToListen(item)">
<u-icon name="volume" color="#71d5a1" size="24"></u-icon>
@@ -108,12 +101,12 @@
console.log('下拉刷新了')
uni.stopPullDownRefresh();
if(this.contentShow == 0){
this.page=1, // 页码
// this.page=1, // 页码
this.bookList = []
this.getfreeBook()
}
else if(this.contentShow == 1){
this.tjPage=1, // 页码
// this.tjPage=1, // 页码
this.tjBookLIst = []
this.getListDate()
}
@@ -122,21 +115,23 @@
this.loadingNow = true
console.log('到底了')
if(this.contentShow == 0){
//console.log(this.page , this.ygtotalPage)
if(this.page < this.ygtotalPage){
this.page++
console.log('加载',this.page)
this.status = 0
this.getfreeBook()
// if(this.contentShow == 0){
// //console.log(this.page , this.ygtotalPage)
// if(this.page < this.ygtotalPage){
// this.page++
// console.log('加载',this.page)
// this.status = 0
// this.getfreeBook()
}else{
this.status = 1
console.log('加载完成了',this.page)
return
}
// }else{
// this.status = 1
// console.log('加载完成了',this.page)
// return
// }
}else if(this.contentShow == 1){
// }
if(this.contentShow == 1){
if(this.tjPage < this.tjTotalPage){
this.tjPage++
console.log('加载',this.tjPage)
@@ -204,8 +199,14 @@
.then(res => {
if(res.code == 0){
this.ygtotalPage = res.page.totalPage
this.bookList = this.bookList.concat(res.page.list)
// this.ygtotalPage = res.page.totalPage
res.page.forEach(item => {
if(item.canListen){
this.bookList.push(item)
}
})
// this.bookList = = this.bookList.concat(res.page.list)
console.log(res,'已购买')
this.status = 3
}
@@ -220,26 +221,24 @@
this.$http
.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
// this.tjTotalPage = res.pages.totalPage
var arr = []
if(res.pages.list.length > 0){
for (var i=0; i<res.pages.list.length; i++ ) {
var booidArr = []
if(res.pages.list[i].bookId != null){
booidArr = res.pages.list[i].bookId.split(',')
//res.pages.list[i].bookId = booidArr
// console.log(booidArr,'booidArr')
res.pages.list[i].bookId = booidArr
}else{
res.pages.list[i].bookId = []
}
}
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(",")
@@ -253,10 +252,12 @@
// }else{
// arr = []
// }
console.log(res.pages.list,'res.pages.list')
// console.log(res.pages.list,'res.pages.list')
this.tjBookLIst = res.pages
// var arr = res.pages.list
this.tjBookLIst = this.tjBookLIst.concat(res.pages.list)
// console.log(res)
// this.tjBookLIst = this.tjBookLIst.concat(res.pages)
console.log(this.tjBookLIst[0].product,'this.tjBookLIst')
this.status = 3
} }
@@ -319,7 +320,9 @@
text-overflow: ellipsis;
font-size: 30rpx; color: #333; padding: 10rpx 0;
}
.videoBox{position: relative;}
.videoBox{position: relative;
image{height: 290rpx;}
}
.playButton{position: absolute; z-index: 1; right: 4px; bottom: 4px; padding: 5px; border-radius: 100%; }
uni-image {
@@ -327,7 +330,7 @@
height: 350rpx;
}
.u-row{flex-wrap: wrap;}
.u-col{overflow: hidden; height: 250px; margin-bottom: 30rpx; }
.u-col{overflow: hidden; margin-bottom:20rpx; }
.listenList{padding: 10rpx; box-sizing: border-box; width: calc(100% - 10rpx);}
.flexbox{display: flex;}
.scroll-Y {

102
pages/listen/listen.vue
View File

@@ -9,7 +9,9 @@
<view class="book_neir">
<view class="flexbox info">
<view class="item">
<image class="bn_img" :src="bookInfo.images"
<image class="bn_img" v-if="bookInfo.images != ''" :src="bookInfo.images"
mode="widthFix"></image>
<image class="bn_img" style="border:1px solid #eee" v-else src="../../static/icon/wufeng.jpg"
mode="widthFix"></image>
</view>
<!-- <img :src="bookInfo.images" class="bn_img"> -->
@@ -115,7 +117,10 @@
playid:null, // 正在播放的章节id
playchapName:'', // 正在播放的章节名称
playIndex:null, // 正在播放的序号值
onlineH:{}, // 线上的历史听书
onlineH:{ // 线上的历史听书
playIndex:null, // 存储的播放index
time:0, // 存储的播放秒数
},
currentTime:{
time:0,
flag:''
@@ -200,7 +205,7 @@
console.log(this.muteBgMusic,this.muteBgMusic?'已关闭音乐####':'已开启音乐####');
},
// 获取线上听书进度
getListenRate(val,op){
getListenRate(){
let data = {
bookId: this.bookid,
userId: this.userInfo.id,
@@ -216,46 +221,42 @@
console.log(res,'历史记录')
if(res.readRate.chapterId){
var item = res.readRate
if(this.$bgm._options.src != '' && res.readRate.chapterId == this.userInfo.playingInfo.chapterId && res.readRate.bookId == this.userInfo.playingInfo.bookid ){
// console.log(this.$bgm)
if(this.$bgm.playing){
console.log('线上存储进度是同一条数据，不做处理')
}else{ // 暂停状态下
this.$bgm.play()
}
return false
}
this.onlineH.time = item.precent
// 有听书进度时
this.onlineH.playIndex = bgm.musicList.findIndex(function(info){
this.onlineH.playIndex = this.libLIst.findIndex(function(info){
// console.log(info,'info')
if(item.chapterId == info.chapterId && item.bookId == info.bookid ){
return info;
}
})
//store.commit('setUserInfo',{'playingInfo':bgm.musicList[bgm.playIndex] })
console.log('线上的播放index是：',this.onlineH.playIndex)
})
console.log('线上的播放index是：',this.onlineH.playIndex)
}else{
// 没有听书进度
// 没有听书进度
this.onlineH.playIndex = 0
this.onlineH.time = 0
}
console.log('到这')
this.$music.setList(this.libLIst,'autoPlay',this.onlineH.playIndex, this.onlineH.time)
})
},
addMusicList(){
if (this.userInfo.playFlag) {
// 暂停
// this.$music.playBgm({mute:true})
// this.$bgm.pause()
uni.showToast({
title:'已经在播放音频',
icon:'none'
})
} else {
// 播放
// this.$music.playBgm({mute:false})
if(this.$bgm._options.src == ''){
this.$music.playBgm({mute:false})
}else{
this.$bgm.play()
}
}
this.getListenRate()
// this.playData = {
// 'myList' : this.libLIst,
// // 'fengImg' : this.fengImg,
// }
// 显示播放组件
this.setUserInfo({'playVisible':true})
this.setUserInfo({'playVisible':true})
uni.setStorage({
key: 'playVisible',
data: true,
@@ -268,10 +269,8 @@
},
// 播放单个音频
listenOne(item,index){
console.log('点击了',index)
listenOne(item,index){
console.log('点击了',index)
if(this.libLIst.length > 0){
this.setUserInfo({'playIndex': index})
this.$music.setList(this.libLIst,'autoPlay',index)
@@ -330,48 +329,7 @@
url: '../eBook/bookMessage?Id=' + id + '&typ=' + e
});
},
// 获取听书进度
getListenRate(){
// this.forceRefresh = false
let data = {
bookId: this.bookid,
userId: this.userInfo.id,
}
$http.request({
url: "book/listening/getReadRate",
method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档
data,
header: { //默认 无 说明：请求头
'Content-Type': 'application/json'
},
}).then(res => {
console.log(res,'历史记录')
if(res.readRate.chapterId){ // 有听书进度时
this.playid = res.readRate.chapterId
this.currentTime.time = res.readRate.precent
this.currentTime.flag = 'init'
// this.forceRefresh = true
for (var i =0; i<this.libLIst.length; i++) {
if(res.readRate.chapterId == this.libLIst[i].chapterId){
this.playIndex = i
}
}
// this.playIndex = res.readRate.id - 1
// console.log('有内容',this.playIndex)
this.playIndex >= this.libLIst.length - 1 ? this.jia = true : this.jia = false
this.playIndex > 0 ? this.jian = true : this.jian = false
// this.firstListen()
}else{ // 没有听书进度时
// this.listen(this.libLIst[0],0)
}
})
},
// 第一次加载音乐播放器
firstListen(){
this.forceRefresh = false

148
pages/peanut/home.vue
View File

@@ -1,11 +1,23 @@
<template>
<view style="font-size: 28upx;">
<!-- <z-nav-bar backState="2000" title="首页"></z-nav-bar> -->
<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>
<text class="prompt">搜索...</text>
<view class="home_bg">
<view class="flexbox" style=" justify-content: space-between; ">
<view class="icon_hua">
<image src="../../static/icon/home_icon_3.png" mode="aspectFit" class="icon_hua_1"></image>
</view>
<view class="search_box flexbox" @click="onPageJump('./searchFor')">
<view class="search">
<text class="icon_search"></text>
<text class="prompt">请输入想要搜索的书名</text>
</view>
</view>
<view class="searBtn flexbox">
<text>搜索</text>
</view>
</view>
<view class="home_lunbo">
<u-swiper :list="list3" indicator indicatorMode="line" circular style="height: 180rpx;"></u-swiper>
</view>
</view>
<!-- <view class="home_nar" v-if="showEbook"> -->
@@ -21,10 +33,10 @@
</view>
<!-- <view class="hn_cl_tit" @click="onPageJump('../bookShop/bookShopIndex')"> -->
<view class="hn_cl_tit shuping" @click="onTabJump()">
<!-- <view class="hn_cl_tit shuping" @click="onTabJump()">
<image src="../../static/icon/home3.png" mode="aspectFit"></image>
<text>书评</text>
</view>
</view> -->
<view class="hn_cl_tit chaoshi" @click="onPageJump('../bookShop/classify')">
<image src="../../static/icon/home4.png" mode="aspectFit"></image>
@@ -32,9 +44,9 @@
</view>
</view>
<view class="home_lunbo">
<!-- <view class="home_lunbo">
<u-swiper :list="list3" indicator indicatorMode="line" circular style="height: 180rpx;"></u-swiper>
</view>
</view> -->
<view class="home_shujia" v-if="showEbook">
<view class="hn_sj" @click="onTabJump('./bookshelf')">
@@ -89,9 +101,21 @@
<view class="head_line" >
<b></b>
<text>新书上市</text>
<i @click="onBookMore('New')">查看更多 ></i>
<!-- <i @click="onBookMore('New')">查看更多 ></i> -->
</view>
<view class="newBook">
<scroll-view class="scroll-view_H " scroll-x="true" scroll-left="10">
<view :class="['item']" v-for="(item,index) in newBookList" :key="index">
<view class="videoBox" @click="goDetail(item.productId)">
<image v-if="item.productImages != ''" :src="item.productImages" mode="scaleToFill"></image>
<image v-else src="../../static/icon/wufeng.jpg" mode="scaleToFill"></image>
</view>
<text class="bookName">{{item.productName}}</text>
</view>
</scroll-view>
</view>
<view class="home_xinshu" v-if="showEbook">
<view v-for="(item, index) in xinsList" @click="onBookJump(item)" v-if="index<3" class="hx_list">
<image :src="item.image"></image>
@@ -214,6 +238,7 @@
transaction: { // 成功回调
},
scrollLeft:0,
maxTimes:1, // 轮询最大次数
ComplateRequestInterval:null, // 轮询定时器
checking:false, // 正在检测
@@ -233,6 +258,7 @@
bgiStyle: {
background: '#fff'
},
newBookList:[],
iconStyle: {
fontSize: '40rpx',
fontWeight: 'bold',
@@ -265,7 +291,7 @@
onPullDownRefresh() {
this.getData()
uni.stopPullDownRefresh()
this.requestIapOrder()
this.requestIapOrder()
},
@@ -291,6 +317,19 @@
//方法
methods: {
...mapMutations(['setUserInfo']),
// 新书上市
getNewBook(){
this.$http
.post('book/shopproduct/getNewBook',{
'limit': 10,
'page':1
})
.then(res => {
console.log(res,'xinshu')
this.newBookList = res.page.list
});
},
// 检测未完成订单
requestIapOrder(){
console.log('检测支付环境...')
@@ -479,6 +518,8 @@
console.log(res.page.list,'首页商品')
this.goodsList = res.page.list
})
this.getNewBook()
},
// 跳转
@@ -519,7 +560,7 @@
url: '../bookShop/commodityDetail?id=' + id
});
},
// 列表跳页
onShopMore(e) {
uni.navigateTo({
@@ -542,7 +583,24 @@
</script>
<style lang="scss" scoped>
@import '@/style/mixin.scss';
.newBook{margin-top: 20rpx;}
.scroll-view_H{background-color: #fff;white-space: nowrap;
width: 100%; padding:10rpx ; }
.scroll-view_H{
.item { padding: 10rpx; overflow: hidden; display: inline-block;
width: 180rpx !important; margin-right: 20rpx; border-radius: 10rpx;
.videoBox{
image{display: block; width:150rpx;
height: 170rpx;
}
}
.bookName{display: block; margin-top: 20rpx; color: #666; font-size: 24rpx; white-space: nowrap;
overflow-x: hidden; overflow: hidden;
text-overflow: ellipsis;}
}
// .item.active{margin-right: 20rpx; border: 1px solid #55aa00; border-radius: 10rpx;}
}
.flexbox{display: flex;}
.head_line {
margin: 50rpx 0 0 0;
@@ -571,50 +629,51 @@
}
.home_bg {
background-image: url('@/static/icon/home_bg.jpg');
background-image: url('@/static/icon/home_bg1.jpg');
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
padding: 100rpx 0 40rpx 0;
padding: 100rpx 20rpx 40rpx 20rpx;
position: relative;
height: 400rpx; margin-bottom: 130rpx;
.icon_hua_1 {
margin: 0 auto;
// margin: 0 auto;
width: 150rpx;
height: 150rpx;
}
.search_box {
width: 90%;
height: 64upx;
background-color: #fff;
border-radius: 32upx;
display: flex;
align-items: center;
padding: 0upx 40upx;
position: absolute;
margin-left: -46%;
left: 50%;
bottom: -30rpx;
box-shadow: 0 0px 10px 1px #54a96633;
.prompt {
color: #cccccc;
.icon_hua{width: 150rpx; display: block;}
.search_box { margin-top: 20rpx; align-items: center;
width: calc(100% - 300rpx);
.search{height: 80upx;
display: flex;
width: 100%;
align-items: center;
padding: 0upx 40upx;
background-color: #fff;
border-radius: 20upx;
box-shadow: 0 0px 10px 1px #54a96633;
}
.prompt {
color: #838383; font-size: 24rpx;
}
.icon_search {
background-image: url('@/static/icon/map_ic_search.png');
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
width: 29upx;
height: 28upx;
width:36upx;
height: 36upx;
margin-right: 20upx;
}
}
}
.searBtn{
width: 80rpx; align-items: center;
font-size: 30rpx; color: #fff;
}
}
.home_nar { padding-bottom: 20rpx;
margin: 30rpx 20rpx; justify-content: space-between;
display: flex;
@@ -626,7 +685,8 @@
// .shuping{ background-color: #d6ffda; border: 2px solid #bae9bf;}
// .shuguan{ background-color:#e3f9f9 ; border: 2px solid #d7eced; }
.hn_cl_tit { padding-bottom: 10rpx;
width: 23%;
// width: 23%;
width: 31%;
text-align: center;
border-radius: 20rpx ; padding-top: 10rpx;
// line-height: 110upx;
@@ -638,9 +698,9 @@
height:110upx;
display: block;
margin: 0 auto;
margin: 0 20rpx;
// margin: 0 20rpx;
}
text{ display:block; margin-top: 10px; font-size: 36rpx; color: #000; font-weight:blod;}
text{ display:block; text-align: center; margin-top: 10px; font-size: 36rpx; color: #000; font-weight:blod;}
}

8
pages/peanut/mine.vue
View File

@@ -18,22 +18,22 @@
</view>
<br clear="both">
</view>
<view class="now_vip" v-if="userMes.vip==0">
<!-- <view class="now_vip" v-if="userMes.vip==0">
<text>
<image src="../../static/icon/mine_p.png" style="height: 44rpx;"></image>
开通会员畅享海量内容
</text>
<b class="kt_btn" @click="onPageJump('./opeVip')">开通VIP</b>
</view>
</view> -->
<view class="now_vip" v-if="userMes.vip==1">
<!-- <view class="now_vip" v-if="userMes.vip==1">
<text>
<image src="../../static/icon/mine_v.png"></image>
尊贵的VIP会员
<font style="font-size: 14rpx;margin-left: 20rpx;">{{userMes.vipValidtime}}到期</font>
</text>
<b class="kt_btn" @click="onPageJump('./opeVip')">立即续费</b>
</view>
</view> -->
<view class="chong_zhi">
<view class="zhanghu" @click="onPageJump('../user/persCount')">

50
pages/peanut/searchFor.vue
View File

@@ -12,7 +12,7 @@
<text v-for="item in historyList" @click="serkeyWord(item)">{{item}}</text>
</view>
</view>
<view class="sear_class" v-if="this.show==1">
<!-- <view class="sear_class" v-if="this.show==1">
<view class="sc_xuan">
<view class="sc_con" v-for="(item,index) in classFen" @click="FenBook(item)"
:class="bookScreen.type == item.id ? 'sc_con sc_con_style' : 'sc_con'">{{item.sort}}</view>
@@ -21,14 +21,14 @@
<view class="sc_con" v-for="(item,index) in classMian" @click="MianBook(item)"
:class="bookScreen.is_charge == item.id ? 'sc_con sc_con_style' : 'sc_con'">{{item.sort}}</view>
</view>
</view>
</view> -->
<view class="sear_list" v-if="this.show==1">
<view class="bl_tioa" v-for="(item,index) in bookList" @click="onBookJump(item)">
<image :src="item.images"></image>
<image :src="item.productImages"></image>
<view>
<text class="bok_name">{{item.name}}</text>
<text class="bok_name">{{item.productName}}</text>
</view>
<view>
<!-- <view>
<text>作者：<text style="color: #333;">{{item.authorName}}</text></text>
</view>
<view>
@@ -36,7 +36,7 @@
</view>
<view>
<text style="line-height: 20rpx;">{{item.title}}</text>
</view>
</view> -->
</view>
<view style="height: 1px;"></view>
<view>
@@ -121,7 +121,8 @@
this.bookScreen.page = this.bookScreen.page + 1
setTimeout(() => {
this.$http
.post('book/book/list', this.bookScreen)
// .post('book/book/list', this.bookScreen)
.post('book/shopproduct/selectList?limit=8&page=1&key='+this.bookScreen.bookName)
.then(res => {
this.totalPage = res.page.totalPage
for (let i in res.page.list) {
@@ -162,8 +163,10 @@
// 获取列表数据
getData() {
this.$http
.post('book/book/list', this.bookScreen)
// .post('book/book/list', this.bookScreen)
.post('book/shopproduct/selectList?limit=8&page=1&key='+ this.bookScreen.bookName)
.then(res => {
console.log(res)
this.bookList = res.page.list
this.totalPage = res.page.totalPage
this.status = 3
@@ -223,9 +226,12 @@
// 电子书内容跳转
onBookJump(e) {
console.log(e,'e')
uni.navigateTo({
url: '../eBook/bookContent?Id=' + e.id
// url: '../eBook/bookContent?Id=' + e.id
url: '../bookShop/commodityDetail?type=2&id=' + e.productId
});
},
},
};
@@ -280,20 +286,22 @@
}
.sear_list {
margin: 50rpx 30rpx 0 30rpx;
margin: 50rpx 30rpx 0 30rpx; display: flex; flex-wrap: wrap; justify-content: space-between;
.bl_tioa {
box-shadow: 0 0px 10px 1px #d3d1d133;
background-color: #fff;
position: relative;
padding: 0 25upx 10upx 220upx;
margin: 0 0 60rpx 0;
width: 30%;
box-shadow: 0 0px 10px 1px #d3d1d133; padding-bottom: 10rpx;
background-color: #fff; margin-bottom: 20rpx;
// position: relative;
// padding: 0 25upx 10upx 220upx;
// margin: 0 0 60rpx 0;
text-align: center;
border-radius: 15rpx;
min-height: 250rpx;
view {
text {
display: block;
text { display: block;
color: #9b9b9b;
font-size: 24rpx;
line-height: 36rpx;
@@ -306,12 +314,10 @@
}
}
image {
position: absolute;
left: 30upx;
top: -20upx;
image { display: inline-block;
padding-top:20rpx;
width: 160upx;
height: 240upx;
height: 220upx;
}
}