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

Merge branch 'master-xie'

Browse Source
This commit is contained in:
@fawn-nine
2023-09-22 11:17:28 +08:00
parent dd00d7f0cc e630e70376
commit 07aa8ef15e
2 changed files with 418 additions and 284 deletions
Download Patch File Download Diff File Expand all files Collapse all files

223
pages/clock/clock.vue
View File

@@ -2,6 +2,11 @@
<view :class="['container', currentDay == linshiDay && taskInfo.id && myword.length == 0 ? 'pb100':'']">
<z-nav-bar title="读书打卡"></z-nav-bar>
<!-- 仿钉钉打卡日历组件 -->
<view class=""
style="padding: 10rpx 20rpx; border-radius: 10rpx; margin-bottom: 20rpx; background-color: #fff; font-size: 24rpx;">
<text>正在参与<em @click="gotoDetail"
style="font-style: normal; font-weight: bold; color: #55aa7f; padding: 10rpx;">{{bookInfo.name}}</em>的打卡任务</text>
</view>
<view class="calendar_container">
<!-- <zsy-calendar @change="change" /> -->
<!-- <clock-date></clock-date> -->
@@ -12,10 +17,12 @@
<text>返回今天</text>
</view>
<!-- <u-icon name="checkbox-mark" color="#55aa7f" size="14" style="display: inline;"></u-icon> -->
<view class="dakaBtn" @tap="buSign()" v-if="signList.indexOf(currentDay) == -1 && currentDay > linshiDay">
<view class="dakaBtn" @tap="buSign()"
v-if="signList.indexOf(currentDay) == -1 && currentDay > linshiDay">
<text style="font-size: 24rpx;">补卡</text>
</view>
<view class="dakaBtn" @tap="kuickSign()" v-if="signList.indexOf(currentDay) == -1 && currentDay == linshiDay">
<view class="dakaBtn" @tap="kuickSign()"
v-if="signList.indexOf(currentDay) == -1 && currentDay == linshiDay">
<text style="font-size: 24rpx;">签到</text>
</view>
<!-- <view v-else class="dakaBtn" style="border-color: #fff;">
@@ -23,19 +30,21 @@
</view> -->
</view>
</view>
<swiper class="swiper scroll-view_H" @animationfinish="animationfinish" @change="swiperChange" :current='currentIndex' :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval"
<swiper class="swiper scroll-view_H" @animationfinish="animationfinish" @change="swiperChange"
: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' : '',
<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>
<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>
<span v-if="currentDay == item1 && signList.indexOf(item1) == -1" class="daka"
@click.stop="kuickSign()">签到</span>
</view>
</swiper-item>
</swiper>
@@ -48,14 +57,14 @@
<view class="video " v-if="taskInfo.video">
<!-- 视频形式的任务 -->
<view class="taskinfo">
<video id="myVideo" :poster="poster" v-show="!addTextShow"
:src="taskInfo.video"
<video id="myVideo" :poster="poster" v-show="!addTextShow" :src="taskInfo.video"
@error="videoErrorCallback" controls></video>
</view>
</view>
<view class="image " v-if="taskInfo.images">
<!-- 图片形式的任务 -->
<image :src="taskInfo.images" @click="previewImage(taskInfo.images)" style="width: 100%;" mode="aspectFit"></image>
<image :src="taskInfo.images" @click="previewImage(taskInfo.images)" style="width: 100%;"
mode="aspectFit"></image>
</view>
<view class="txt" v-if="taskInfo.content" v-html="taskInfo.content"></view>
</view>
@@ -73,11 +82,13 @@
</view>
<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>
<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>{{item.createTime}}</span>
<span class="flexbox"><u-icon name="clock"
color="#b3b3b3"></u-icon>{{item.createTime}}</span>
</view>
</view>
</view>
@@ -95,7 +106,8 @@
<view class="contentBox">
<div class="pjimgs flexbox">
<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>
<image v-if="item1.length > 10" @click="previewImage(item1)" :src="item1"
mode="aspectFill" style="width:100%; height: 50px;"></image>
</view>
</div>
@@ -153,7 +165,8 @@
</view>
</u-popup>
<view class="leaveBtn" v-if="!addTextShow && currentDay == linshiDay && taskInfo.id && myword.length == 0">
<button style="height: 70rpx; font-size: 28rpx; line-height: 70rpx;" type="primary" plain="true" @click="addTextShow = true">说点什么</button>
<button style="height: 70rpx; font-size: 28rpx; line-height: 70rpx;" type="primary" plain="true"
@click="addTextShow = true">说点什么</button>
</view>
<music-play :playData="playData"></music-play>
<!-- <z-navigation></z-navigation> -->
@@ -202,6 +215,7 @@
windowHeight: 500,
isShowEmj: false,
playData: {},
bookInfo: {}, // 书籍信息
videoContext: null,
innerAudioContext: null, // 音频对象
poster: '',
@@ -235,9 +249,11 @@
onLoad(e) {
this.bookid = e.bookid
this.windowWidth = uni.getSystemInfoSync().windowWidth;
},
onShow() {
this.getBookInfo()
this.initDay()
this.getmySign()
},
onReady() {
this.videoContext = uni.createVideoContext('myVideo')
@@ -248,6 +264,27 @@
...mapState(['userInfo'])
},
methods: {
// 获取书籍信息
getBookInfo() {
this.$http
.post('book/book/appinfo/' + this.bookid + '/' + this.userInfo.id)
.then(res => {
if (res.code == 0) {
console.log(res, 'res')
this.bookInfo = res.book
} else {
console.log(res.msg)
}
console.log(res, 'res基本信息')
}).catch((error) => {
console.log(error)
})
},
gotoDetail() {
uni.navigateTo({
url: '../eBook/bookContent?Id=' + this.bookInfo.id
});
},
swiperChange(e) {
console.log(e, 'change')
},
@@ -329,7 +366,8 @@
// 获取当天我的发布内容
getmyWord() {
this.$http
.post('book/clockin/myinfolist?userid='+this.userInfo.id+'&taskid='+ this.taskInfo.id + '&bookid='+this.bookid)
.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) {
@@ -419,7 +457,8 @@
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.taskInfo.video != '' ? this.poster = this.taskInfo.video +
"?x-oss-process=video/snapshot,t_0,f_jpg" : ''
this.getmyWord()
this.getAllSign(this.taskInfo)
} else {
@@ -438,7 +477,7 @@
console.log('正在补卡', this.taskInfo)
if (!this.taskInfo.id) {
uni.showToast({
title:'当天未发布打卡任务',
title: '当天未发布打卡任务，不可补卡哦',
icon: 'none'
})
return
@@ -474,6 +513,14 @@
},
// 快捷签到
kuickSign() {
if (!this.taskInfo.id) {
uni.showToast({
title: '当天未发布打卡任务,不可签到哦',
icon: 'none'
})
return false
}
let data = {
"bookId": this.bookid,
"userId": this.userInfo.id,
@@ -491,8 +538,10 @@
if (res.code == 0) {
//console.log(res, '快捷签到')
uni.showToast({
title:'签到成功'
title: '签到成功',
icon: 'success'
})
return false
this.addTextShow = false
this.formData.content = ''
this.formData.images = []
@@ -501,6 +550,7 @@
}
});
},
// 说点什么
goToSign() {
@@ -665,23 +715,76 @@
</script>
<style lang="scss" scoped>
.pjimgs{ margin: 10px 0;flex-wrap: wrap; display: flex;
.item{width: 23%; margin-right: 10px;
.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;}
.contentBox {
width: calc(100% - 50px);
box-sizing: border-box;
padding-left: 20rpx;
.content {
font-size: 28rpx;
line-height: 40rpx;
}
.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; }
.time {
font-size: 24rpx;
color: #999;
margin-top: 6rpx;
float: right;
}
.allComments{ background-color: #fff; margin-top: 20rpx; padding: 20rpx; }
.quesheng{text-align: center; margin-top: 100rpx; color: #8b8a91;}
.haveSignText{color: #999 ;}
}
.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;
}
.quesheng {
text-align: center;
margin-top: 100rpx;
color: #8b8a91;
}
.haveSignText {
color: #999;
}
.calendar_info {
display: flex;
align-items: center;
@@ -699,7 +802,9 @@
border: #55aa7f 1px solid;
border-radius: 10rpx;
}
.fanhuiDay{ margin-right: 20rpx;
.fanhuiDay {
margin-right: 20rpx;
// height: 52rpx;
font-size: 24rpx;
// line-height: 52rpx;
@@ -713,10 +818,17 @@
.scroll-view_H {
white-space: nowrap;
margin: 8rpx 0; height: 120rpx !important;
margin: 8rpx 0;
height: 120rpx !important;
width: 100%;
.swiperPage{ justify-content: space-between; height: 120rpx !important;}
.item { box-sizing: border-box;
.swiperPage {
justify-content: space-between;
height: 120rpx !important;
}
.item {
box-sizing: border-box;
width: calc(20% - 12rpx) !important;
border: 1px dashed #999;
height: 120rpx;
@@ -728,7 +840,8 @@
border-radius: 20rpx;
padding: 12rpx;
.day {display: block;
.day {
display: block;
font-size: 26rpx;
color: #999;
@@ -746,13 +859,15 @@
.buka {
font-size: 24rpx;
display: inline-block; padding: 0 12rpx;
display: inline-block;
padding: 0 12rpx;
color: #888;
// border: 1px solid #888;
margin: 10px 0;
border-radius: 20rpx;
margin-bottom: 0; ;
margin-bottom: 0;
;
}
.weidaka {
@@ -763,9 +878,11 @@
margin-bottom: 0;
display: block;
}
.daka {
font-size: 24rpx;
display: inline-block; padding: 0 6rpx;
display: inline-block;
padding: 0 6rpx;
border: 1px solid #55aaff;
color: #55aaff;
margin: 10px 0;
@@ -787,6 +904,7 @@
.day {
font-size: 26rpx;
color: #fff;
em {
font-size: 30rpx;
font-style: normal;
@@ -799,6 +917,7 @@
display: block;
}
}
.item.current {
border: 1px solid #55aaff;
@@ -811,6 +930,7 @@
.day {
font-size: 26rpx;
color: #55aaff;
em {
font-size: 30rpx;
font-style: normal;
@@ -819,10 +939,13 @@
}
}
}
.item.linshiDay {
.daka {
color: #fff; border-color:#fff;
color: #fff;
border-color: #fff;
}
border: 1px solid #55aaff;
text-align: center;
@@ -830,9 +953,11 @@
background-color: #55aaff;
border-radius: 20rpx;
padding: 6px 6px;
.day {
font-size: 26rpx;
color: #fff;
em {
font-size: 32rpx;
font-style: normal;
@@ -840,7 +965,10 @@
padding-right: 2px;
}
}
.buka{color: #fff; }
.buka {
color: #fff;
}
}
}
@@ -902,13 +1030,16 @@
}
.clockTitle {
color: #55aa7f;
font-size: 38rpx;
text-align: center;
display: block;
margin-top: 30rpx; margin-bottom: 30rpx;
margin-top: 30rpx;
margin-bottom: 30rpx;
}
.container1 {
.margin-top {
margin-top: 30rpx;
@@ -1027,6 +1158,12 @@
.flexbox {
display: flex;
}
.mb50{margin-bottom: 50rpx;}
.pb100{padding-bottom: 100rpx;}
.mb50 {
margin-bottom: 50rpx;
}
.pb100 {
padding-bottom: 100rpx;
}
</style>

21
pages/clock/index.vue
View File

@@ -8,11 +8,11 @@
<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>
<view class="videoBox demo-layout bg-purple" @click="goToClock(item)">
<image v-if="item.images != ''" :src="item.images" mode="scaleToFill" ></image>
<image v-else src="../../static/icon/wufeng.jpg" mode="scaleToFill" ></image>
</view>
<text class="bookName">{{item.book.name}}</text>
<text class="bookName">{{item.name}}</text>
</u-col>
</u-row>
</view>
@@ -66,19 +66,16 @@
// 获取打卡图书
getfreeBook(){
this.$http
.post('book/userebookbuy/appbooklist', {
// .post('book/userebookbuy/buylist', {
// .post('book/buyorderdetail/querybuy', {
.post('book/userebookbuy/getUserClockBookList', { // 磊哥新写
// .post('book/userebookbuy/appbooklist', { 原接口
'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
this.bookList = res.books
console.log(this.bookList,'打卡列表')
// this.status = 3
}
});
@@ -124,7 +121,7 @@
height: 350rpx;
}
.u-row{flex-wrap: wrap;}
.u-col{overflow: hidden; height: 250px; margin-bottom: 30rpx; }
.u-col{overflow: hidden; margin-bottom: 30rpx; }
.listenList{padding: 10rpx; box-sizing: border-box; width: calc(100% - 10rpx);}
.flexbox{display: flex;}
.scroll-Y {