首頁丝滑

This commit is contained in:
魏啾
2024-05-16 15:08:20 +08:00
parent 855e165bff
commit d16da9cdba
5 changed files with 109 additions and 61 deletions

View File

@@ -4,6 +4,7 @@
// #ifdef MP-WEIXIN // #ifdef MP-WEIXIN
uni.cache.set('menuInfo', uni.getMenuButtonBoundingClientRect()); uni.cache.set('menuInfo', uni.getMenuButtonBoundingClientRect());
// #endif // #endif
uni.cache.set('NAME', '零点八零');
}, },
onShow: function() { onShow: function() {
this.$store.dispatch("HeightActions"); //获取随时获取页面的高度 this.$store.dispatch("HeightActions"); //获取随时获取页面的高度

View File

@@ -126,4 +126,7 @@ export default {
productqueryShopIdByTableCode(data) { //通过桌码获取shopId productqueryShopIdByTableCode(data) { //通过桌码获取shopId
return uni.api.get("/product/queryShopIdByTableCode", data); return uni.api.get("/product/queryShopIdByTableCode", data);
}, },
geocodelocation(data) { //根据经纬度获取信息
return uni.api.get("/location/geocode", data);
},
} }

View File

@@ -222,7 +222,7 @@
], ],
"globalStyle": { "globalStyle": {
"navigationBarTextStyle": "black", "navigationBarTextStyle": "black",
"navigationBarTitleText": "美味抢先点", "navigationBarTitleText": "零点八零",
"navigationBarBackgroundColor": "#ffffff", "navigationBarBackgroundColor": "#ffffff",
"backgroundColor": "#F2F2F2" "backgroundColor": "#F2F2F2"
}, },

View File

@@ -37,7 +37,8 @@
</view> </view>
<view class="therecontent_box_item"> <view class="therecontent_box_item">
<view class="therecontent_box_imge flex-between" <view class="therecontent_box_imge flex-between"
style="background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/towcontent_box2.png) no-repeat; background-size: cover;" @click="jrtoday(1)"> style="background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/towcontent_box2.png) no-repeat; background-size: cover;"
@click="jrtoday(1)">
<view class="therecontent_box_imge_text"> <view class="therecontent_box_imge_text">
{{salesList.name}} {{salesList.name}}
</view> </view>
@@ -83,7 +84,7 @@
type: Object, type: Object,
default () { default () {
return { return {
salesList:[] salesList: []
} }
} }
}, },
@@ -91,7 +92,7 @@
type: Object, type: Object,
default () { default () {
return { return {
todayList:[] todayList: []
} }
} }
}, },
@@ -100,16 +101,16 @@
default: '每日特价' default: '每日特价'
} }
}, },
methods:{ methods: {
clickproduct(item){ clickproduct(item) {
uni.pro.navigateTo('product/index',{ uni.pro.navigateTo('product/index', {
id:item.id id: item.id
}) })
}, },
jrtoday(e){ jrtoday(e) {
if(e == 0){ if (e == 0) {
uni.pro.navigateTo('index/jtoday') uni.pro.navigateTo('index/jtoday')
}else{ } else {
uni.pro.navigateTo('index/hotlist') uni.pro.navigateTo('index/hotlist')
} }
} }
@@ -125,7 +126,7 @@
width: 336rpx; width: 336rpx;
border-radius: 18rpx; border-radius: 18rpx;
background: #FFFFFF; background: #FFFFFF;
height:396rpx;
.therecontent_box_itembox { .therecontent_box_itembox {
padding: 10rpx 18rpx 24rpx 24rpx; padding: 10rpx 18rpx 24rpx 24rpx;
@@ -148,6 +149,7 @@
font-weight: 400; font-weight: 400;
font-size: 24rpx; font-size: 24rpx;
color: #333333; color: #333333;
text { text {
margin-left: 4rpx; margin-left: 4rpx;
overflow: hidden; overflow: hidden;

View File

@@ -17,8 +17,8 @@
<!-- 标题搜索框 --> <!-- 标题搜索框 -->
<view class="flex-between"> <view class="flex-between">
<view class="navbar_tow_one flex-start" @click="uindexlist"> <view class="navbar_tow_one flex-start" @click="uindexlist">
<text class="textnth-childone">美味抢先点</text> <text class="textnth-childone">{{NAME}}</text>
<text class="textnth-childtow">西安</text> <text class="textnth-childtow">{{form.address}}</text>
<u-icon style="margin-left: 8rpx;" name="arrow-down-fill" color="#333333" <u-icon style="margin-left: 8rpx;" name="arrow-down-fill" color="#333333"
size="16"></u-icon> size="16"></u-icon>
</view> </view>
@@ -60,8 +60,8 @@
</view> </view>
</view> </view>
<view class="fivecontent" > <view class="fivecontent">
<!-- <view class="fivecontent" :style="{'height':seighT + 'px'}"> --> <!-- <view class="fivecontent" :style="{'height':seighT + 'px'}"> -->
<!-- <scroll-view :style="{'height':seighT + 'px'}" scroll-y @scrolltolower="loadMore" <!-- <scroll-view :style="{'height':seighT + 'px'}" scroll-y @scrolltolower="loadMore"
scroll-with-animation> --> scroll-with-animation> -->
<view class="fivecontent_item" v-for="(item,index) in homelist" :key="index" <view class="fivecontent_item" v-for="(item,index) in homelist" :key="index"
@@ -165,8 +165,8 @@
<!-- 标题搜索框 --> <!-- 标题搜索框 -->
<view class="flex-between"> <view class="flex-between">
<view class="navbar_tow_one flex-start" @click="uindexlist"> <view class="navbar_tow_one flex-start" @click="uindexlist">
<text class="textnth-childone">八点八零</text> <text class="textnth-childone">{{NAME}}</text>
<text class="textnth-childtow">西安</text> <text class="textnth-childtow">{{form.address}}</text>
<u-icon style="margin-left: 8rpx;" name="arrow-down-fill" color="#333333" <u-icon style="margin-left: 8rpx;" name="arrow-down-fill" color="#333333"
size="16"></u-icon> size="16"></u-icon>
</view> </view>
@@ -188,26 +188,26 @@
</view> </view>
</view> </view>
<!-- 显示下拉字段 --> <!-- 显示下拉字段 -->
<view class="sixcontent" v-if="clickhometoplistmenulist.detail">
<view class="sixcontent" v-if="clickhometoplistmenulist.quilt == '1' ">
<view class="sixcontentitemP flex-start" style="padding-bottom:0 ;">
<category style="width: 100%;" :categoryList="clickhometoplistmenulist.detail"
:subCategoryList="subCategoryList" @categoryMainClick="categoryMainClick"
@categorySubClick="categorySubClick">
</category>
</view>
</view>
<view class="sixcontent" v-else>
<view class="sixcontentitemP flex-colum-start"> <view class="sixcontentitemP flex-colum-start">
<view class="sixcontentitemP_item" <view class="sixcontentitemP_item"
:class="index == clickdetailindex ?'sixcontentitemP_itemactive':''" :class="index == clickdetailindex ?'sixcontentitemP_itemactive':''"
v-for="(item,index) in clickhometoplistmenulist.detail" :key="index" v-for="(item,index) in clickhometoplistmenulist.detail" :key="index"
@click="clickdetail(item,index)"> @click="clickdetail(item,index)">
{{item.label}} {{item.name}}
</view> </view>
</view> </view>
</view> </view>
<view class="sixcontent" v-if="clickhometoplistmenulist.districts">
<view class="sixcontentitemP flex-start" style="padding-bottom:0 ;">
<category style="width: 100%;"
:categoryList="clickhometoplistmenulist.districts"
:subCategoryList="subCategoryList" @categoryMainClick="categoryMainClick"
@categorySubClick="categorySubClick">
</category>
</view>
</view>
</view> </view>
</u-popup> </u-popup>
@@ -233,6 +233,7 @@
}, },
data() { data() {
return { return {
NAME: uni.cache.get('NAME'),
timersetInterval: '0', //定时器 timersetInterval: '0', //定时器
isFixedTop: false, //吸顶是否显示 isFixedTop: false, //吸顶是否显示
Topdistance: 3000, //吸顶初始距离 Topdistance: 3000, //吸顶初始距离
@@ -249,7 +250,10 @@
itemStyle: [ //样式 itemStyle: [ //样式
], ],
homelist: [], //下面数据 homelist: [], //下面数据
clickhometoplistmenulist: {}, //下拉点击的数据 clickhometoplistmenulist: {
detail: [],
quilt: ''
}, //下拉点击的数据
form: { form: {
address: '西安市', //地址 address: '西安市', //地址
type: '', //品类 type: '', //品类
@@ -291,10 +295,14 @@
return this.$store.getters.is_BarHeight return this.$store.getters.is_BarHeight
}, },
}, },
async onLoad() { mounted() {
setTimeout(() => { setTimeout(() => {
this.GetTop() this.$nextTick(() => {
this.GetTop()
});
}, 1000) }, 1000)
// 当组件挂载完成后获取距离
}, },
onReachBottom() { onReachBottom() {
this.onLoadhome() this.onLoadhome()
@@ -302,28 +310,50 @@
onShow() { onShow() {
uni.getLocation({ uni.getLocation({
type: 'wgs84', type: 'wgs84',
success: (res) => { success: async (res) => {
let datastorage = { let successres = await this.api.geocodelocation({
address: '西安市', //地址
lng: res.longitude, lng: res.longitude,
lat: res.latitude, lat: res.latitude,
})
if (successres.code == 0) {
let datastorage = {
country: successres.data.addressComponent.country, // "中国"
province: successres.data.addressComponent.province, //province: "陕西省"
address: successres.data.addressComponent.city, //district: "西安市"
district: successres.data.addressComponent.district, //district: "未央区"
lng: res.longitude,
lat: res.latitude,
}
uni.cache.set('getLocationstorage', datastorage);
this.hometop()
this.init_fn()
this.timersetInterval = '0'
} }
uni.cache.set('getLocationstorage', datastorage);
this.hometop()
this.init_fn()
this.timersetInterval = '0'
}, },
fail: (err) => { fail: async (err) => {
let datastorage = {
address: '西安市', //地址
lng: res.longitude,
lat: res.latitude,
}
uni.cache.set('getLocationstorage', datastorage);
this.hometop()
this.init_fn()
this.timersetInterval = '0'
console.log(err, '获取错误') console.log(err, '获取错误')
let successres = await this.api.geocodelocation({
lng: '',
lat: '',
})
if (successres.code == 0) {
console.log(successres.data.addressComponent.streetNumber.location.split(','))
let res = successres.data.addressComponent.streetNumber.location.split(',')
// this.form.lng = res[0]
// this.form.lat = res[1]
let datastorage = {
country: successres.data.addressComponent.country, // "中国"
province: successres.data.addressComponent.province, //province: "陕西省"
address: successres.data.addressComponent.city, //district: "西安市"
district: successres.data.addressComponent.district, //district: "未央区"
lng: res[0],
lat: res[1],
}
uni.cache.set('getLocationstorage', datastorage);
this.hometop()
this.init_fn()
this.timersetInterval = '0'
}
} }
}); });
@@ -354,11 +384,8 @@
success: (data) => { success: (data) => {
this.seighT = data.windowHeight; this.seighT = data.windowHeight;
this.$u.getRect('.fourcontent').then(res => { this.$u.getRect('.fourcontent').then(res => {
this.Topdistance = res.top - this.HeighT.heightBar //滚动距离 console.log(res.top)
this.seighT = this.seighT - res.height //高度 this.Topdistance = res.top - res.height -20 //滚动距离
})
this.$u.getRect('.navbar').then(res => {
this.seighT = this.seighT - res.height //高度
}) })
} }
}) })
@@ -461,9 +488,10 @@
this.viewHistoryindex = index this.viewHistoryindex = index
if (item.dictName == 'allCity') { if (item.dictName == 'allCity') {
let res = await this.api.locationdistrict({ let res = await this.api.locationdistrict({
keywords: '西安市' keywords: uni.cache.get('getLocationstorage').address
}) })
this.clickhometoplistmenulist = res.data[0] this.clickhometoplistmenulist.detail = res.data
this.clickhometoplistmenulist.quilt = '1'
} else { } else {
this.clickhometoplistmenulist = item this.clickhometoplistmenulist = item
} }
@@ -488,7 +516,7 @@
console.log(category); console.log(category);
this.clickdetailindex = index this.clickdetailindex = index
this.showproductlist = false this.showproductlist = false
this.hometoplist.menu[this.viewHistoryindex].name = item.label this.hometoplist.menu[this.viewHistoryindex].name = item.name
switch (item.dictName) { switch (item.dictName) {
case 'category': case 'category':
// 品类 // 品类
@@ -507,13 +535,28 @@
}, },
//城市二级菜单 //城市二级菜单
categoryMainClick(category) { categoryMainClick(category) {
console.log(category); console.log(category.category.name);
this.subCategoryList = category.category.districts; if (category.category.name == '全城') {
this.showproductlist = false
this.form.lng = uni.cache.get('getLocationstorage').lng,
this.form.lat = uni.cache.get('getLocationstorage').lat,
this.form.address = uni.cache.get('getLocationstorage').address, //地址
this.form.page = 1
this.form.size = 10
this.form.status = 'loadmore'
this.homelist = []
this.onLoadhome()
this.hometoplist.menu[this.viewHistoryindex].name = uni.cache.get('getLocationstorage').address
this.subCategoryList = []
} else {
this.subCategoryList = category.category.districts;
}
}, },
//确定街道菜单赋值 //确定街道菜单赋值
categorySubClick(category) { categorySubClick(category) {
console.log(category); console.log(category);
this.hometoplist.menu[this.viewHistoryindex].name = category.name this.hometoplist.menu[this.viewHistoryindex].name = category.name
this.form.address = category.name //地址
this.showproductlist = false this.showproductlist = false
console.log(category.center.split(',')) console.log(category.center.split(','))
let res = category.center.split(',') let res = category.center.split(',')
@@ -718,8 +761,7 @@
.fivecontent { .fivecontent {
padding: 0 28rpx; padding: 0 28rpx;
overflow: auto; height: 100vh;
.fivecontent_item:nth-child(1) { .fivecontent_item:nth-child(1) {
margin-top: 0; margin-top: 0;
} }