首页 分类列表

This commit is contained in:
魏啾
2024-04-09 09:26:47 +08:00
parent d844832aad
commit 289b808bf6
11 changed files with 1032 additions and 14 deletions

View File

@@ -15,7 +15,7 @@
<view class="therecontent_box_itembox">
<view class="therecontent_box_itembox_item flex-between" v-for="(item,index) in todayList.todayList"
:key="item">
<image src="@/static/avatar.png" mode="aspectFill"></image>
<image :src="item.image" mode="aspectFill"></image>
<view class="therecontent_box_itembox_itemview">
<view class="therecontent_box_itembox_itemviewone">
{{item.productName}}
@@ -50,7 +50,7 @@
</view>
<view class="therecontent_box_itembox">
<view class="therecontent_box_itembox_item flex-between" v-for="(item,index) in salesList.hotList" :key="item">
<image src="@/static/avatar.png" mode="aspectFill"></image>
<image :src="item.image" mode="aspectFill"></image>
<view class="therecontent_box_itembox_itemview">
<view class="therecontent_box_itembox_itemviewone flex-start">
<view class="therecontent_box_itembox_itemviewoneafter">

View File

@@ -49,10 +49,12 @@
<!-- 今日上线 -->
<todaylist :todayList='hometoplist.todayList' :salesList='hometoplist.salesList'></todaylist>
<!-- 类目 -->
<view class="fourcontent flex-between" @click="viewHistory">
<view class="fourcontent_item flex-start" v-for="(item,index) in hometoplist.menu" :key="index">
<view class="fourcontent flex-between">
<view class="fourcontent_item flex-start" v-for="(item,index) in hometoplist.menu" :key="index"
@click="viewHistory(item)">
<text>{{item.name}}</text>
<u-icon style="margin-left: 8rpx;" name="arrow-down-fill" color="#333333" size="16"></u-icon>
<u-icon v-if="item.isChild" style="margin-left: 8rpx;" name="arrow-down-fill" color="#333333"
size="16"></u-icon>
</view>
</view>
@@ -172,10 +174,35 @@
<!-- 吸顶 -->
<view class="fourcontent flex-between" style="padding: 28rpx 0 28rpx 28rpx">
<view class="fourcontent_item flex-start" v-for="(item,index) in hometoplist.menu"
:key="index">
:key="index" @click="viewHistory(item)">
<text>{{item.name}}</text>
<u-icon style="margin-left: 8rpx;" name="arrow-down-fill" color="#333333"
size="16"></u-icon>
<u-icon v-if="item.isChild" style="margin-left: 8rpx;" name="arrow-down-fill"
color="#333333" size="16"></u-icon>
</view>
</view>
<!-- 显示下拉字段 -->
<view class="sixcontent" v-if="clickhometoplistmenulist.detail">
<view class="sixcontentitemP flex-colum-start">
<view class="sixcontentitemP_item"
:class="index == clickdetailindex ?'sixcontentitemP_itemactive':''"
v-for="(item,index) in clickhometoplistmenulist.detail" :key="index"
@click="clickdetail(item,index)">
{{item.label}}
</view>
</view>
</view>
<view class="sixcontent" v-if="clickhometoplistmenulist.districts">
<view class="sixcontentitemP flex-start">
<view class="sixcontentitemP_itembox flex-colum-start">
<view class="sixcontentitemP_itemone"
:class="index == clickdetailindex ?'sixcontentitemP_itemactive':''"
v-for="(item,index) in clickhometoplistmenulist.districts" :key="index"
@click="clickdetail(item,index)">
{{item.name}}
</view>
</view>
</view>
</view>
</view>
@@ -205,12 +232,14 @@
keyword: '',
current: 0,
opacity: false,
showproductlist: false, //弹成
showproductlist: true, //弹成
clickdetailindex: 0, //默认下拉选项第一个
hometoplist: { //上面数据
carousel: [],
district: []
},
homelist: [], //下面数据
clickhometoplistmenulist: {}, //下拉点击的数据
form: {
address: '', //地址
type: '', //品类
@@ -219,7 +248,6 @@
page: 1, //页数
size: 10, //页容量
status: 'loadmore'
}
};
},
@@ -242,10 +270,14 @@
return this.$store.getters.is_BarHeight
},
},
onLoad() {
async onLoad() {
setTimeout(() => {
this.GetTop()
}, 1000)
let res = await this.apix.locationdistrict({
keywords: '西安市'
})
this.clickhometoplistmenulist = res.data[0].districts
},
onReachBottom() {
this.onLoadhome()
@@ -315,12 +347,30 @@
//TODO handle the exception
}
},
async viewHistory() {
this.showproductlist = true
// 点击元素到指定位置
async viewHistory(item) {
if (item.dictName == 'allCity') {
let res = await this.apix.locationdistrict({
keywords: '西安市'
})
this.clickhometoplistmenulist = res.data[0]
} else {
this.clickhometoplistmenulist = item
}
uni.pageScrollTo({
scrollTop: this.Topdistance + 1,
duration: 300
});
if (item.isChild) {
this.showproductlist = true
} else {
}
},
// 选择元素的指定选项
clickdetail(item, index) {
this.clickdetailindex = index
this.showproductlist = false
},
}
@@ -466,6 +516,48 @@
}
}
.sixcontent {
.sixcontentitemP {
padding: 0 32rpx 28rpx 32rpx;
max-height: 600rpx;
overflow: auto;
.sixcontentitemP_itembox {
.sixcontentitemP_itemone {
flex: 1;
margin-top: 16rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #666666;
}
.sixcontentitemP_itemone:nth-child(1) {
margin-top: 0rpx;
}
}
.sixcontentitemP_item:nth-child(1) {
margin-top: 0rpx;
}
.sixcontentitemP_item {
margin-top: 16rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #666666;
}
.sixcontentitemP_itemactive {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
font-size: 24rpx;
color: #666666;
}
}
}
.fivecontent {
padding: 0 28rpx;