图书分类

This commit is contained in:
yanwenlong
2024-01-10 22:33:29 +08:00
parent 098c609927
commit ec5e36a74a
2 changed files with 87 additions and 11 deletions

View File

@@ -29,7 +29,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:40rpx 20rpx;">
<view class="" style="padding:20rpx 20rpx;">
<view class="mytabs flexbox">
<view :class="['item','item1', contentShow == 1 ? 'active' :'']" @click="setData(1)">
已购图书
@@ -39,6 +39,11 @@
</view>
</view>
</view>
<scroll-view class="scroll-view_H " scroll-x="true" scroll-left="0">
<view class="ProTabs">
<text v-for="item in tagList" :key="item.splId" :class="[tabsid == item.splId ? 'cur' :'']" @click="tabsChange(item)">{{item.labelName}}</text>
</view>
</scroll-view>
<view class="listenList">
<view class="wrap" v-if="contentShow == 1">
<view class="" v-if="bookList.length > 0">
@@ -202,6 +207,16 @@
name: '推荐图书'
}
],
tagList:[
{splId:"",labelName:"全部"},
{splId:"2",labelName:"中医经典"},
{splId:"1",labelName:"中医基础"},
{splId:"3",labelName:"各家学说"},
{splId:"4",labelName:"中医临床"},
{splId:"5",labelName:"文学"},
{splId:"6",labelName:"哲学"},
] ,// 推荐标签列表
tabsid: ''
}
},
onLoad() {
@@ -282,6 +297,13 @@
contentButtonClick(e) {
this.contentShow = e.index
},
tabsChange(item){
this.bookList = []
this.tabsid = item.splId
this.page = 1
// 获取推荐数据
this.getfreeBook()
},
// 获取已购买书籍
getfreeBook() {
this.$http
@@ -289,7 +311,8 @@
// .post('book/buyorderdetail/querybuy', {
'userId': this.userInfo.id,
'page': this.page,
'limit': 10
'limit': 10,
'type':this.tabsid
})
.then(res => {
@@ -539,9 +562,33 @@
height: 300rpx;
}
.scroll-view_H {
white-space: nowrap;
width: 100%;
// .scroll-view_H {
// white-space: nowrap;
// width: 100%;
// }
.scroll-view_H{background-color: #fff;white-space: nowrap;
padding:10rpx ; margin-top: 12rpx;}
.scroll-view_H{
.item { padding: 10rpx; overflow: hidden; display: inline-block; padding-bottom: 0;
width: 180rpx !important; margin-right: 20rpx; border-radius: 10rpx;
.videoBox{
image{display: block; width:150rpx;
height: 170rpx;
}
}
.bookName{display: block; margin-top: 6rpx; 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;}
}
.ProTabs{
// margin: 20rpx 0;
padding:0 20rpx;
text{padding: 8rpx 14rpx; font-size: 32rpx; display: inline-block; border-radius: 10rpx; overflow: hidden;
// background-color: #eee;
color: #55aa7f; margin-right: 10rpx;}
text.cur{background-color:#55aa7f ; color: #fff;}
}
.scroll-view-item {

View File

@@ -231,6 +231,11 @@
<text v-for="item in tagList" :key="item.splId" :class="[tabsid == item.splId ? 'cur' :'']" @click="tabsChange(item)">{{item.labelName}}</text>
</view>
</scroll-view>
<scroll-view class="scroll-view_H " scroll-x="true" scroll-left="0" v-if="tabsid == 16">
<view class="wzProTabs">
<text v-for="item in wztaglist" :key="item.splId" :class="[wztabsid == item.splId ? 'cur' :'']" @click="wztabsChange(item)">{{item.labelName}}</text>
</view>
</scroll-view>
<!-- 商品展示 -->
<view class="goods">
<!-- 精选 -->
@@ -325,6 +330,12 @@
color: '#54a966',
},
tagList:[] ,// 推荐标签列表
wztaglist:[
{splId:"",labelName:"全部"},
{splId:"5",labelName:"文学"},
{splId:"6",labelName:"哲学"},
],
wztabsid: '',
pageSize:10,
page:1,
totalPage:0,
@@ -438,11 +449,19 @@
});
},
tabsChange(item){
this.tjProList = []
this.tabsid = item.splId
this.page = 1
// 获取推荐数据
this.getJtData()
this.tjProList = []
this.tabsid = item.splId
this.wztabsid = ''
this.page = 1
// 获取推荐数据
this.getJtData()
},
wztabsChange(item){
this.tjProList = []
this.wztabsid = item.splId
this.page = 1
// 获取推荐数据
this.getJtData()
},
getJtData(){
this.$http
@@ -450,7 +469,8 @@
.post('book/label/getProductsByLabel',{
'splId': this.tabsid,
'limit': this.pageSize,
'page': this.page
'page': this.page,
'type': this.wztabsid
})
.then(res => {
@@ -774,6 +794,15 @@
color: #55aa7f; margin-right: 10rpx;}
text.cur{background-color:#55aa7f ; color: #fff;}
}
.wzProTabs{
display: flex;
justify-content: center;
padding:0 20rpx;
text{padding: 8rpx 14rpx; font-size: 32rpx; display: inline-block; border-radius: 10rpx; overflow: hidden;
// background-color: #eee;
color: #55aa7f; margin-right: 10rpx;}
text.cur{background-color:#55aa7f ; color: #fff;}
}
// .newBook{margin-top: 10rpx;}
.scroll-view_H{background-color: #fff;white-space: nowrap;
padding:10rpx ; margin-top: 12rpx;}