You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

203 lines
4.6 KiB

<template>
<view class="dabang-index">
<view class="top-box">
<view class="dabang-name">{{studyListDto.listName}}</view>
<view class="time-box acea-row row-column">
<text>时间{{studyListDto.listStartTime.split(' ')[0]}} {{studyListDto.listEndTime.split(' ')[0]}}{{studyListDto.clockTimes}}</text>
<text>进行中{{studyListDto.signTimes}}/{{studyListDto.clockTimes}}</text>
<view class="sanjiao"></view>
</view>
</view>
<!-- <view class="join-num">参与人数{{detail.enterNum}}</view> -->
<!-- 打榜分享 -->
<view class="dabang-share-box">
<view class="dabang-share-item" v-for="(item,index) in dataList" :key="index">
<view class="user-info-box acea-row row-middle">
<view class="header-img">
<image :src="item.avatar" mode=""></image>
</view>
<view class="acea-row row-column row-center">
<view class="name">{{item.realName}}</view>
<view class="create-time">{{item.recordTime}}</view>
</view>
</view>
<view class="share-word">
{{item.content}}
</view>
<view class="img-box acea-row">
<image :src="imgUrl" mode="aspectFill" v-for="(imgUrl,idx) in item.imgPaths" :key="idx"></image>
</view>
<view class="zan-box acea-row row-middle row-right" @click="voteClick(item)">
<image src="../../static/zan.png" v-if="!item.isVote"></image>
<image src="../../static/like.png" v-else></image>
<text class="zan-conunt">{{item.voteNum}}</text>
</view>
</view>
</view>
</view>
</template>
<script>
import { studyListVote} from '@/api/knowledge';
import { myMemberStudylist} from '@/api/serverTeacher';
export default{
data(){
return {
active: 0,
studyId: '',
memberId:'',
studyListDto:{},
dataList:[]
}
},
onLoad() {
this.studyId = this.$yroute.query.studyId;
this.memberId = this.$yroute.query.memberId;
console.log( this.$yroute.query.studyId)
console.log( this.$yroute.query.memberId)
this.myMemberStudylist();
},
methods:{
myMemberStudylist(){
myMemberStudylist({memberId:this.memberId,studyId:this.studyId}).then((res)=>{
if(res.success){
this.studyListDto = res.data.studyListDto
this.dataList = res.data.recordDtos;
uni.stopPullDownRefresh();
}
})
},
voteClick(item){
let id = item.id,
voteNum = item.voteNum,
isVote = !item.isVote;
this.dataList.map((item)=>{
if(item.id == id){
if(item.isVote){
item.voteNum = item.voteNum - 1
} else{
item.voteNum = item.voteNum + 1
}
item.isVote = !item.isVote
}
})
let data = {
"studylistRecordId": id,
"type": isVote ? '1' : '0'
}
studyListVote(data).then((res)=>{
if(res.success){
uni.showToast({
title: '操作成功!'
})
}
})
},
tabClick(idx){
this.active = idx;
},
onPullDownRefresh() {
this.myMemberStudylist();
}
}
}
</script>
<style lang="less" scoped>
.dabang-index{
min-height: 100vh;
background: #fff;
padding-bottom: 100rpx;
.top-box{
width: 100%;
height: 344rpx;
background: linear-gradient(135deg, #E5B964 0%, #CE9F45 100%);
box-sizing: border-box;
padding: 40rpx 0;
color: #fff;
position: relative;
.dabang-name{
width: 80%;
font-size: 50rpx;
font-weight: 600;
color: #FFFFFF;
line-height: 72rpx;
margin: 40rpx auto;
}
.time-box{
width: 100%;
background: rgba(0,0,0,.1);
font-size: 28rpx;
padding: 20rpx 20rpx;
position: absolute;
bottom: 0;
text{
display: inline-block;
margin:6rpx 0;
}
}
.sanjiao{
width:0;
height:0;
border-right:14rpx solid transparent;
border-left:14rpx solid transparent;
border-bottom:16rpx solid #fff;
position: absolute;
left: 50%;
bottom: 0;
transform: translateX(-50%);
}
}
.dabang-share-box{
width: 100%;
padding: 30rpx;
.dabang-share-item{
color: #222;
padding:20rpx 0;
border-bottom: 1px solid #ececec;
.header-img{
width: 76rpx;
height: 76rpx;
border-radius: 50%;
overflow: hidden;
margin-right: 10rpx;
}
.name{
font-size: 28rpx;
line-height: 40rpx;
}
.create-time{
font-size: 24rpx;
color: #999;
line-height: 34rpx;
}
.share-word{
font-size: 28rpx;
line-height: 46rpx;
margin: 22rpx 0 30rpx;
}
.img-box{
image{
width: 224rpx;
height: 206rpx;
margin-right: 10rpx;
border-radius: 10rpx;
}
}
.zan-box{
margin-top: 20rpx;
image{
width: 30rpx;
height: 32rpx;
margin-right: 20rpx;
}
}
}
}
image{
width: 100%;
height: 100%;
}
}
</style>