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
2024-05-23 15:31:35 +08:00
parent edf80bea28
commit dbc2f863c3
5 changed files with 348 additions and 318 deletions
Download Patch File Download Diff File Expand all files Collapse all files

117
pages/peanut/home.vue
View File

@@ -133,10 +133,19 @@
<b></b>
<text>新书上市</text>
</view> -->
<view class="search_box flexbox" @click="onPageJump('../peanut/searchFor')">
<view class="search">
<text class="icon_search"></text>
<text class="prompt">请输入书名</text>
</view>
<view class="searBtn">
<text>书名检索</text>
</view>
</view>
<!-- 营销标签 -->
<scroll-view class="scroll-view_H " scroll-x="true" scroll-left="0">
<view class="ProTabs">
<scroll-view class=" yxTagBox" scroll-x="true">
<view class="ProTabs flexbox">
<text v-for="(item,index) in yingxiaoTags" :key="item.id" :class="[yxCurIndex == index ? 'cur' :'']"
@click="yxTabsChange(item,index)">{{item.title}}</text>
</view>
@@ -224,30 +233,18 @@
<!-- <i @click="onPageJump('../bookShop/classify')">查看更多 ></i> -->
<!-- </view> -->
<view class="search_box flexbox" @click="onPageJump('../peanut/searchFor')">
<view class="search">
<text class="icon_search"></text>
<text class="prompt">请输入书名</text>
</view>
<view class="searBtn">
<text>书名检索</text>
</view>
</view>
<scroll-view class="ProTabsBox">
<view class="New_ProTabs flexbox">
<text v-for="(item,index) in catTagList" :key="item.splId" :class="[tabsid == item.id ? 'cur' :'']"
@click="tabsChange(item,index)">{{item.title}}</text>
</view>
</scroll-view>
<view class="children_cate flexbox" v-if="childrenCatList && childrenCatList.length > 0">
<view @click="childrenChange(item,index)" :class="['item',curChildrenId == item.id ? 'cur':'']"
v-for="(item, index) in childrenCatList" :key="item.id">
<text>{{item.title}}</text>
<view class="children_cate_box " v-if="childrenCatList && childrenCatList.length > 0">
<view class="children_cate flexbox">
<view @click="childrenChange(item,index)" :class="['item',curChildrenId == item.id ? 'cur':'']"
v-for="(item, index) in childrenCatList" :key="item.id">
<text>{{item.title}}</text>
</view>
</view>
</view>
<!-- 商品展示 -->
@@ -516,7 +513,7 @@
tag_id = this.yingxiaoTags[0].id
} else {
tag_id = item.id
}
}
this.$http
.post('book/labelAndMarket/getShopProductListByMarketId', {
'marketId': tag_id
@@ -524,12 +521,12 @@
.then(res => {
if (res.code == 0 && res.result.length > 0) {
this.YXBookList = res.result
}else{
} else {
this.YXBookList = []
}
// console.log(res.result, '营销商品列表')
}).catch( e =>{
}).catch(e => {
this.YXBookList = []
});
},
@@ -574,7 +571,7 @@
this.getJtData(this.childrenCatList[index].id)
},
tabsChange(item, cindex) {
// this.tjProList = []
// this.tjProList = []
this.tabsid = item.id
this.childrenCatList = []
if (this.catTagList[cindex].isLast == 1) {
@@ -610,7 +607,7 @@
// this.getJtData()
},
getJtData(cid) {
this.$http
// .post('book/label/list',{
.post('book/labelAndMarket/getShopProductListByLabelId', {
@@ -909,36 +906,46 @@
<style lang="scss" scoped>
@import '@/style/mixin.scss';
.yxTagBox {}
.children_cate_box {
padding: 0 10px;
}
.children_cate {
border-radius: 5px;
justify-content: space-evenly;
padding: 0 10rpx;
background-color: #fff;
background-color: #eee;
display: flex;
justify-items: normal;
padding-top: 12rpx;
overflow: hidden;
padding-bottom: 10rpx;
.item {
width: 100%; text-align: center;
margin-right: 1px;
font-size: 32rpx;
padding: 10rpx;
color: #fff;
// background-color: #55aa7f;
background-color: #eee;
width: 100%;
text-align: center;
align-items: center;
border-right: 1px solid #acacac33;
font-size: 28rpx;
color: #333;
border-radius: 10rpx;
// border-radius: 10rpx;
}
.item:last-child {
margin-right: 0;
border-right: none;
}
.cur {
color: #55aa7f; font-weight: bold;
color: #55aa7f;
font-weight: bold;
border-radius: 5rpx;
}
}
.fiveIcon {
@@ -986,6 +993,7 @@
.ProTabs {
// margin: 20rpx 0;
padding: 0 20rpx;
align-items: center;
text {
@@ -994,37 +1002,54 @@
display: inline-block;
border-radius: 10rpx;
overflow: hidden;
// background-color: #eee;
color: #55aa7f;
background-color: #dfeae2;
color: #0e583a; font-weight: bold;
margin-right: 10rpx;
display: block;
width: 100%;
text-align: center;
}
text.cur {
background-color: #55aa7f;
color: #fff;
}
text:last-child {
margin-right: 0;
}
}
.ProTabsBox {
margin-top: 10px;
padding-bottom: 3px;
}
.New_ProTabs {
justify-content: space-between;
background-color: #fff;
padding-left: 5px; padding-right: 5px;
padding-left: 10px;
padding-right: 10px;
text {
// max-width: 12.5%;
// background-color: #56565633;
background-color: #dfeae2;
color: #0e583a;
font-size: 32rpx;
padding: 5px 3px;
font-weight: bold;
display: block;
width: 100%;
margin-right: 5px;
border-radius: 10rpx;
overflow: hidden;
// background-color: #eee;
color: #333;
// white-space:wrap !important;
text-align: center;
}
text:last-child {
margin-right: 0;
}
text.cur {
background-color: #55aa7f;
color: #fff;
@@ -1057,7 +1082,7 @@
.scroll-view_H {
background-color: #fff;
white-space: nowrap;
padding: 10rpx;
padding: 10px;
margin-top: 12rpx;
}
@@ -1166,7 +1191,7 @@
.search_box {
margin: 20rpx auto 10rpx auto;
align-items: center;
width: calc(100% - 30rpx);
width: calc(100% - 40rpx);
margin-bottom: 20rpx;
.search {