页面布局修改 订单修改

This commit is contained in:
@fawn-nine
2023-09-28 16:58:16 +08:00
parent c785f36086
commit 6031018523
5 changed files with 166 additions and 43 deletions

View File

@@ -28,7 +28,7 @@
<!-- <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="" style="padding:40rpx 20rpx;">
<view class="mytabs flexbox">
<view :class="['item','item1', contentShow == 1 ? 'active' :'']" @click="setData(1)">
已购图书
@@ -42,14 +42,70 @@
<view class="wrap" v-if="contentShow == 1">
<view class="" v-if="bookList.length > 0">
<u-row gutter="16" justify="flex-start">
<u-col span="4" v-for="(item,index) in bookList" :key="index">
<view class=" listenItem">
<view class="" @click="goDetail(item)">
<image v-if="item.images != '' && item.images != null" :src="item.images" mode="scaleToFill"></image>
<image v-else src="../../static/icon/wufeng.jpg" mode="scaleToFill"></image>
<u-col span="12" v-for="(item,index) in bookList" :key="index">
<view>
<view class="flexbox yigoumaiList">
<view class="info">
<view class="videoBox demo-layout bg-purple">
<image v-if="item.images != '' && item.images != null" :src="item.images"
mode="scaleToFill"></image>
<image v-else src="../../static/icon/wufeng.jpg" mode="scaleToFill"></image>
</view>
</view>
<view class="btns">
<view class="text">
<view class="bookName">{{item.name}}</view>
<view class="author">
作者<text v-if="item.authorName == null || item.authorName == ''">暂无</text>
<text v-else>{{item.authorName}}</text>
</view>
</view>
<view class="flexbox icons">
<view class="item " >
<!-- <u-icon name="chat" color="#fcbd71" size="24"></u-icon> -->
<view v-if="item.clockIn != null && item.clockIn != 2" @click="goDaKa(item)">
<image src="../../static/icon/home1.png" mode="aspectFit"></image>
</view>
<view v-else @click="noOp()">
<image class="gray" src="../../static/icon/home1.png" mode="aspectFit"></image>
</view>
<view class="v1"><text> </text></view>
</view>
<view class="item " >
<!-- <u-icon name="volume" color="#71d5a1" size="24"></u-icon> -->
<view v-if="item.canListen" @click="goToListenFree(item)">
<image src="../../static/icon/home2.png" mode="aspectFit"></image>
</view>
<view v-else @click="noOp()">
<image class="gray" src="../../static/icon/home2.png" mode="aspectFit"></image>
</view>
<view class="v1"><text> </text></view>
</view>
<view class="item " @click="goPingshu(item)">
<!-- <u-icon name="chat" color="#fcbd71" size="24"></u-icon> -->
<view class="">
<image src="../../static/icon/home3.png" mode="aspectFit"></image>
</view>
<view class="v1"><text> </text></view>
</view>
<view class="item " >
<!-- <u-icon name="chat" color="#fcbd71" size="24"></u-icon> -->
<view class="" v-if="item.teachIn != null && item.teachIn != 0" @click="goJiangShu(item)">
<image src="../../static/icon/home4.png" mode="aspectFit"></image>
</view>
<view class="" v-else @click="noOp()">
<image class="gray" src="../../static/icon/home4.png" mode="aspectFit"></image>
</view>
<view class="v1">
<text> </text>
</view>
</view>
</view>
</view>
<view class="bookName">{{item.name}}</view>
</view>
</view>
</u-col>
</u-row>
<view>
@@ -71,7 +127,8 @@
<u-col span="4" v-for="(item,index) in tjBookLIst" :key="index">
<view class=" listenItem">
<view class="" @click="goDetail(item)">
<image v-if="item.images != '' && item.images != null" :src="item.images" mode="scaleToFill"></image>
<image v-if="item.images != '' && item.images != null" :src="item.images"
mode="scaleToFill"></image>
<image v-else src="../../static/icon/wufeng.jpg" mode="scaleToFill"></image>
</view>
<view class="bookName"><text>{{item.name}}</text></view>
@@ -163,7 +220,7 @@
// this.loadingNow = true
console.log('到底了')
if (this.contentShow == 1) {
if (this.page+1 <= this.totalPage) {
if (this.page + 1 <= this.totalPage) {
this.page++
this.status = 0
this.getfreeBook()
@@ -206,7 +263,7 @@
goPingshu(val) {
console.log('评书', val)
uni.navigateTo({
url: '../comments/comments?bookid=' + val,
url: '../comments/comments?bookid=' + val.id,
});
},
contentButtonClick(e) {
@@ -228,12 +285,12 @@
if (res.page.records.length > 0) {
this.bookList = this.bookList.concat(res.page.records)
this.totalPage = res.page.pages
if(this.page == this.totalPage){
if (this.page == this.totalPage) {
this.status = 1
}else{
} else {
this.status = 3
}
} else {
this.bookList = []
}
@@ -269,7 +326,12 @@
});
},
noOp(){
uni.showToast({
title:'该书未开通此功能',
icon:'none'
})
},
// 跳转详情页
goDetail(item) {
console.log(item, 'goDetail-----')
@@ -285,11 +347,23 @@
});
},
// 跳转到讲书
goJiangShu(val){
uni.navigateTo({
url: '../talkBook/talkBookDetail?bookId='+ val.id
})
},
// 跳转到打卡
goDaKa(val){
uni.navigateTo({
url: '../clock/clock?bookid='+ val.id
})
},
// 跳转到听书详情
goToListenFree(item) {
// console.log(item,'item')
uni.navigateTo({
url: "../listen/listen?bookid=" + item.bookId + "&fengImg=" + item.image // 前台播放版本
url: "../listen/listen?bookid=" + item.id // 前台播放版本
});
},
// 跳转11
@@ -304,7 +378,33 @@
<style lang="scss" scoped>
@import '@/style/mixin.scss';
.gray {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray;
}
.yigoumaiList{ background-color: #fff;
.btns{ margin-left: 20rpx; width: calc(100% - 200rpx); box-sizing: border-box; font-size: 34rpx; justify-content: space-between;
.item{ margin-bottom:30rpx; width: 20%; text-align: center;
image{
display: block; margin-right: 10rpx; height: 112rpx;
}
.v1{margin-top: -30rpx;}
}
}
.author{
font-size: 28rpx; color: #999;
}
.info{width:200rpx;
image{width:100% ; height: 280rpx; border-radius: 20rpx;}
}
.icons{ margin-top: 10rpx;
text{font-size: 26rpx; margin-top: -10rpx; color: #999;}
}
}
.hehan {
width: 50%;
margin: 0 auto;
@@ -317,13 +417,13 @@
.mytabs {
// background: url('@/static/icon/bgtushu.png') no-repeat left top;
height: 80rpx;
margin-bottom: 30rpx;
// margin-bottom: 30rpx;
.item {
border-radius: 10rpx;
background-color: #c6ead0;
width: 48%;
margin: 0 10rpx;
// margin: 0 10rpx;
text-align: center;
color: #3c7f56;
font-size: 36rpx;
@@ -336,7 +436,7 @@
}
.item1 {
// background-color: #adb6b7;
margin-right: 20rpx;
}
}
@@ -407,7 +507,7 @@
}
.listenList {
padding: 10rpx;
padding:0 20rpx;
box-sizing: border-box;
width: calc(100% - 10rpx);
}
@@ -475,7 +575,7 @@
background-size: cover;
padding: 20rpx;
position: relative;
margin-bottom: 30rpx;
// margin-bottom: 30rpx;
// height: 400rpx; margin-bottom: 130rpx;
.icon_hua_1 {
@@ -511,9 +611,9 @@
margin-bottom: 20rpx;
.search {
height: 56upx;
height: 56upx;
display: flex;
width: 100%;
width: 86%; margin: 0 auto;
align-items: center;
padding: 0upx 40upx;
background-color: #fff;