<template>
|
<view class="community-wrapper wrapperLayer">
|
<view class="topfixed-container colCen borderBox">
|
<view class="topbarbox"></view>
|
<view class="search-bar-container rowCen">
|
<view class="searchbox-content rowCen">
|
|
<view class="adrs-txt" style="font-size: 32rpx;">
|
本地生活
|
</view>
|
</view>
|
|
<view class="lft-adrs-content rowCenCen" @tap="openAction()">
|
<view class="adrs-txt">
|
{{cityInfo.label}}
|
</view>
|
<image class="downIcon" src="../../static/images/community/down.png" mode=""></image>
|
</view>
|
|
|
</view>
|
</view>
|
<view class="topbarbox"></view>
|
<view class="pageContent-container colCen">
|
<!-- 金刚区 -->
|
<view class="classify-container borderBox rowCen" v-if="homeMenu.length>0">
|
<scroll-view scroll-x class="class-scroll rowCen">
|
<view class="scroll-content">
|
<block v-for="(items,index) in homeMenu" :key="index">
|
<view class="clas-items colCen" @tap="goUrl(items)">
|
<image class="iconPic" :src="items.image" mode="aspectFill"></image>
|
<view class="items-txt">
|
{{items.mname}}
|
</view>
|
</view>
|
</block>
|
</view>
|
</scroll-view>
|
</view>
|
|
|
|
|
|
|
|
<view class="bottom-nav-bar borderBox">
|
|
</view>
|
|
<view v-if="locationInfo">
|
<!-- 内容-->
|
<view class="flex-row eleme-item" v-for="(item,index) in eleStoreList" :key="index" @tap="toMiniProgram(item)">
|
|
<view>
|
<image :src="item.shop_logo" class="img"></image>
|
</view>
|
<view class="m-left-20 flex-col-jcr" >
|
<view class="title">
|
<view style="margin-right: 10rpx;"><image src="../../static/images/app/elem_item.png" style="width: 35rpx;height: 35rpx;line-height:35rpx;"></image> </view>
|
<view class="item-title">{{item.title}}</view></view>
|
<view class="monthly-sales m-top-20">{{item.indistinct_monthly_sales}}</view>
|
<view class="flex-row m-top-20">
|
<view style="width: 94rpx;height: 36rpx;background: #FF3824;border-radius: 4rpx 0rpx 0rpx 4rpx;font-size: 24rpx;
|
font-weight: 500;color: #FFFFFF;" class="flex-row-cen">下单返</view>
|
<view style="width: 102rpx;height: 36rpx;background: #FFEDE9;border-radius: 0rpx 4rpx 4rpx 0rpx;font-size: 24rpx;
|
font-weight: 500;color: #FF3824;" class="flex-row-cen">{{item.commission_rate}}</view>
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 加载中 -->
|
|
<view class="loading-more" style="margin: 10rpx 0 20rpx 0;">
|
<text class="loading-more-text">{{loadmore}}</text>
|
</view>
|
|
</view>
|
|
<view class="noLocation" v-else>
|
{{locaStatus}}
|
</view>
|
</view>
|
|
<u-select v-model="ctshow" mode="mutil-column-auto" :list="multiSelector" @confirm="selectCity"></u-select>
|
|
<u-action-sheet :list="actionlist" v-model="actionshow" :cancel-btn="true" @click="actionClick">
|
</u-action-sheet>
|
</view>
|
</template>
|
|
<script>
|
import getLocation from '../../utils/getLocation.js'
|
import drawtab from '../../utils/mineTab.js'
|
import utils from '../../utils/utils.js'
|
|
export default {
|
components: {
|
},
|
data() {
|
return {
|
searchTxt: '',
|
cityInfo: '',
|
locationInfo: '',
|
navCurrent: 0,
|
locaStatus: '',
|
|
multiSelector: [],
|
ctshow: false,
|
actionshow: false,
|
actionlist: [{
|
text: '定位当前位置'
|
}, {
|
text: '列表选择城市'
|
}],
|
|
homeMenu: [],
|
youXuan: [],
|
recommendList: [],
|
sessionId: '',
|
eleStoreList: [],
|
loadmore: "数据加载中",
|
}
|
},
|
onLoad() {
|
this.locationInfo = uni.getStorageSync('locationInfo');
|
var cityInfo = uni.getStorageSync('cityInfo');
|
console.log(cityInfo)
|
if(cityInfo){
|
this.cityInfo = cityInfo;
|
} else{
|
this.siteInfo()
|
}
|
this.gethomeMenu()
|
this.getEleStoreList()
|
},
|
onShow() {
|
},
|
onHide() {
|
},
|
onPullDownRefresh() {
|
console.log("下拉刷新"+this.locationInfo)
|
if (this.locationInfo) {
|
//this.getyouXuan()
|
this.sessionId = ''
|
this.getEleStoreList()
|
} else {
|
this.siteInfo()
|
}
|
this.gethomeMenu()
|
},
|
methods: {
|
openMiNiProgram(item){
|
|
},
|
async getEleStoreList(){
|
console.log(this.locationInfo)
|
if(!this.locationInfo) {
|
this.locationInfo = await getLocation(this)
|
uni.setStorageSync('locationInfo', this.locationInfo)
|
}
|
console.log(1111)
|
console.log(this.locationInfo, '定位定位定位定位定位定位')
|
var that = this;
|
this.multiSelector = []
|
this.$u.api.eleStoreList({
|
longitude: this.locationInfo.longitude,
|
latitude: this.locationInfo.latitude,
|
pageSize: 20,
|
sessionId: this.sessionId ? this.sessionId : '',
|
}).then(e => {
|
if(e.code != 0) return that.$alert(e.msg)
|
var res = e.data;
|
if (res.list.length < 20) {
|
that.loadmore = '没有更多了'
|
}else {
|
that.loadmore = '上拉加载数据'
|
}
|
that.sessionId = res.session_id;
|
if(that.sessionId){
|
console.log("不为空"+that.sessionId)
|
that.eleStoreList = that.eleStoreList.concat(res.list)
|
|
}else{
|
console.log("为空"+that.sessionId)
|
that.eleStoreList = res.list
|
if(res.list.length == 0){
|
that.loadmore = '附近无商家'
|
}
|
}
|
|
|
}).catch(function (err) {
|
})
|
uni.stopPullDownRefresh();
|
|
|
// this.$http.post('localLife/eleStoreList', {
|
// longitude: this.locationInfo.longitude,
|
// latitude: this.locationInfo.latitude,
|
// pageSize: 20,
|
// sessionId: this.sessionId ? this.sessionId : '',
|
// }, 'application/json').then((res) => {
|
// console.log("饿了么列表"+JSON.stringify(res))
|
|
|
|
// if (res.eleStoreList.length < 20) {
|
// this.loadmore = '没有更多了'
|
// }else {
|
// this.loadmore = '上拉加载数据'
|
// }
|
// if(this.sessionId){
|
// console.log("不为空"+this.sessionId)
|
// this.eleStoreList = this.eleStoreList.concat(res.eleStoreList)
|
|
// }else{
|
// console.log("为空"+this.sessionId)
|
// this.eleStoreList = res.eleStoreList
|
// if(res.eleStoreList.length == 0){
|
// this.loadmore = '附近无商家'
|
// }
|
// }
|
// this.sessionId = res.sessionId
|
// }).catch(res=>{
|
// console.log("resresresresres"+JSON.stringify(res))
|
// })
|
// uni.stopPullDownRefresh();
|
},
|
openAction() {
|
this.actionshow = true
|
},
|
actionClick(e) {
|
//console.log(e);
|
if (e == 0) {
|
this.siteInfo()
|
} else {
|
this.getprovince()
|
}
|
},
|
getprovince() {
|
var that = this;
|
this.multiSelector = []
|
this.$u.api.getCity({}).then(e => {
|
if(e.code != 0) return that.$alert(e.msg)
|
that.multiSelector = e.data.list
|
that.ctshow = true
|
}).catch(function (err) {
|
})
|
},
|
|
selectCity(e) {
|
var that = this;
|
if (!e[1]) {
|
e.push(0)
|
}
|
this.cityInfo = e[1];
|
uni.setStorageSync('cityInfo', this.cityInfo)
|
this.$u.api.coordinate({
|
city:this.cityInfo.label
|
}).then(e => {
|
if(e.code != 0) return that.$alert(e.msg)
|
that.locationInfo = e.data.info;
|
uni.setStorageSync('locationInfo', that.locationInfo)
|
//this.getyouXuan()
|
that.eleStoreList = [];
|
this.getEleStoreList()
|
if (that.navCurrent == 1) {
|
that.$refs.mtSelect.getList()
|
} else if (that.navCurrent == 0) {
|
that.$refs.nearbyShop.getCates()
|
} else if (that.navCurrent == 2) {
|
that.$refs.ambitusShop.getList()
|
}
|
}).catch(function (err) {
|
})
|
},
|
|
async siteInfo() {
|
this.locationInfo = await getLocation(this)
|
uni.setStorageSync('locationInfo', this.locationInfo)
|
var that = this;
|
this.$u.api.getCityId({name: this.locationInfo.address.city}).then(e => {
|
if(e.code != 0) return that.$alert(e.msg)
|
that.cityInfo = e.data.info;
|
uni.setStorageSync('cityInfo', that.cityInfo)
|
that.eleStoreList = [];
|
if (that.locationInfo) {
|
if (that.navCurrent == 1) {
|
that.$refs.mtSelect.getList()
|
} else if (that.navCurrent == 0) {
|
that.$refs.nearbyShop.getCates()
|
} else if (that.navCurrent == 2) {
|
that.$refs.ambitusShop.getList()
|
}
|
}
|
}).catch(function (err) {
|
})
|
},
|
gethomeMenu() {
|
var that = this;
|
this.$u.api.bdHomemenu({}).then(e => {
|
var res = e.data.list;
|
that.homeMenu = res.topHomeMenu
|
}).catch(function (err) {
|
})
|
},
|
txtinput() {
|
if (this.navCurrent != 0) {
|
this.navCurrent = 0
|
}
|
},
|
ceshi(item) {
|
// 1拉起微信小程序 0 不拉
|
var isAppletJump = getApp().globalData.appinfo.isAppletJump;
|
if (isAppletJump) {
|
utils.goUrl(item);
|
|
} else {
|
if (item.activityType == '2') {
|
this.$http.post('mthomeMenu/jtk', {
|
activityType: item.activityType
|
}).then(zhuanlianres => {
|
|
plus.runtime.openURL(zhuanlianres.deeplink, res => {
|
uni.navigateTo({
|
url: '../webView/webView?url=' + encodeURIComponent((
|
zhuanlianres.longH5 ? zhuanlianres.longH5 :
|
zhuanlianres.h5))
|
})
|
});
|
})
|
} else {
|
utils.goUrl(item);
|
}
|
}
|
|
|
},
|
toMiniProgram(item) {
|
|
// #ifdef APP-PLUS
|
plus.share.getServices(function(res) {
|
var sweixin = null;
|
for (var i = 0; i < res.length; i++) {
|
var t = res[i];
|
if (t.id == 'weixin') {
|
sweixin = t;
|
}
|
}
|
if (sweixin) {
|
sweixin.launchMiniProgram({
|
id: 'gh_6506303a12bb',
|
type: 0, //0 正式 1 测试 2 体验 小程序的版本
|
path: item.link.wx_path //这里你要跳的路径,可以传值
|
});
|
}
|
}, function(res) {
|
console.log(JSON.stringify(res));
|
});
|
|
// #endif
|
|
},
|
navTap(index) {
|
this.navCurrent = index
|
},
|
searchShop() {
|
this.navCurrent == 0
|
if (this.navCurrent == 0) {
|
this.$refs.nearbyShop.newData()
|
}
|
},
|
goUrl(info) {
|
// console.log(info);
|
utils.goUrl(info,this)
|
}
|
},
|
|
onReachBottom() {
|
if (this.loadmore == '没有更多了') {
|
uni.showToast({
|
icon: 'none',
|
title: '没有更多了'
|
})
|
return;
|
}
|
this.getEleStoreList()
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.flex-row{
|
display: flex;
|
flex-direction: row;
|
}
|
.flex-row-cen{
|
display: flex;
|
flex-direction: row;
|
justify-content: center;
|
}
|
.flex-col-jcr{
|
display: flex;
|
flex-direction: column;
|
justify-content: space-between;
|
}
|
.m-left-20{
|
margin-left: 20rpx;
|
}
|
.m-top-20{
|
margin-top: 20rpx;
|
}
|
.community-wrapper {
|
width: 100%;
|
|
.topfixed-container {
|
width: 100%;
|
background-color: #FFFFFF;
|
position: fixed;
|
left: 0;
|
top: 0;
|
padding-bottom: 10rpx;
|
z-index: 100;
|
padding-right: 26rpx;
|
|
.search-bar-container {
|
width: 100%;
|
height: 90rpx;
|
|
.lft-adrs-content {
|
/* width: 253rpx; */
|
|
.adrs-txt {
|
font-size: 28rpx;
|
font-weight: 500;
|
color: #333333;
|
margin-right: 10rpx;
|
}
|
|
.downIcon {
|
width: 19rpx;
|
height: 11rpx;
|
}
|
}
|
|
.searchbox-content {
|
margin-left: 20rpx;
|
font-size: 36rpx;
|
font-weight: bold;
|
color: #333333;
|
line-height: 36rpx;
|
flex: 1;
|
|
/* .searchIcon {
|
width: 28rpx;
|
height: 28rpx;
|
margin-right: 20rpx;
|
}
|
|
|
.s-txt-ipt {
|
flex: 1;
|
color: #222222;
|
font-size: 26rpx;
|
}
|
|
.s-txt {
|
font-size: 26rpx;
|
font-weight: 500;
|
color: #666666;
|
} */
|
}
|
}
|
}
|
|
.pageContent-container {
|
width: 100%;
|
margin-top: 110rpx;
|
|
.classify-container {
|
width: 100%;
|
height: 340rpx;
|
padding: 0 22rpx;
|
margin-bottom: 30rpx;
|
background-color: #FFFFFF;
|
|
.class-scroll {
|
width: 100%;
|
height: 320rpx;
|
|
.scroll-content {
|
width: 100%;
|
height: 320rpx;
|
display: flex;
|
flex-direction: column;
|
flex-wrap: wrap;
|
|
.clas-items {
|
margin: 15rpx 20rpx;
|
|
.iconPic {
|
width: 80rpx;
|
height: 80rpx;
|
}
|
|
.items-txt {
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #333333;
|
margin-top: 10rpx;
|
}
|
}
|
}
|
}
|
}
|
|
|
.recommend-container {
|
width: 100%;
|
padding: 0 26rpx;
|
margin-bottom: 20rpx;
|
|
.shadow-content {
|
width: 100%;
|
background: #FFFFFF;
|
border-radius: 12rpx;
|
|
.model-bar {
|
width: 100%;
|
height: 200rpx;
|
|
.lefticon {
|
width: 130rpx;
|
height: 100%;
|
|
.iconimg {
|
width: 35rpx;
|
height: 38rpx;
|
}
|
|
.tipstxt {
|
font-size: 24rpx;
|
font-weight: bold;
|
color: #333333;
|
margin: 10rpx 0;
|
}
|
|
.tips-pink {
|
height: 30rpx;
|
background: rgba(255, 0, 44, 0.1);
|
border-radius: 13rpx;
|
font-size: 20rpx;
|
font-weight: 500;
|
color: #FF002C;
|
padding: 0 9rpx;
|
}
|
}
|
|
.right-GoodsContent {
|
flex: 1;
|
height: 100%;
|
margin-top: 10rpx;
|
padding: 0 4rpx;
|
|
.goods-itms {
|
margin: 0 16rpx;
|
|
.gs-icon {
|
width: 108rpx;
|
height: 108rpx;
|
border-radius: 8rpx;
|
}
|
|
.price-txt {
|
font-size: 24rpx;
|
font-weight: bold;
|
color: #FF002C;
|
margin-top: 10rpx;
|
}
|
}
|
|
.borderitm {
|
border-bottom: 1rpx solid #F2F2F2;
|
}
|
}
|
}
|
}
|
}
|
|
.meituan-youxuan {
|
width: 100%;
|
padding: 0 26rpx;
|
margin-bottom: 20rpx;
|
|
.backgd-content {
|
width: 100%;
|
background: linear-gradient(-90deg, #FDF4B1, #FDE76D);
|
border-radius: 16rpx;
|
|
.container-title {
|
width: 100%;
|
height: 80rpx;
|
padding: 0 20rpx;
|
|
.left-title-content {
|
.txttitle {
|
font-size: 32rpx;
|
font-weight: bold;
|
color: #333333;
|
margin-right: 20rpx;
|
}
|
|
.brownBox {
|
width: 55rpx;
|
height: 31rpx;
|
background: #C99107;
|
border-radius: 4rpx 0px 0px 4rpx;
|
font-size: 20rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
}
|
|
.whiteBox {
|
width: 55rpx;
|
height: 31rpx;
|
background: #FFFFFF;
|
border-radius: 0px 4rpx 4rpx 0px;
|
font-size: 20rpx;
|
font-weight: bold;
|
color: #C99107;
|
}
|
}
|
|
.right-title-content {
|
.txt {
|
font-size: 20rpx;
|
font-weight: 500;
|
color: #958532;
|
}
|
}
|
}
|
|
.goods-content {
|
width: 100%;
|
padding: 0 22rpx;
|
margin-bottom: 26rpx;
|
|
.white-content {
|
width: 100%;
|
flex-wrap: wrap;
|
border-radius: 16px;
|
background-color: #FFFFFF;
|
|
.goods-items {
|
margin: 38rpx 15rpx 25rpx 15rpx;
|
|
.goodspic {
|
width: 120rpx;
|
height: 120rpx;
|
border-radius: 12rpx;
|
}
|
|
.pricebox {
|
font-size: 24rpx;
|
font-weight: bold;
|
color: #FF002C;
|
margin-top: 10rpx;
|
}
|
}
|
}
|
}
|
}
|
}
|
|
.bottom-nav-bar {
|
width: 100%;
|
padding: 0 26rpx;
|
|
.white-nav-bar {
|
width: 100%;
|
height: 80rpx;
|
background-color: #FFFFFF;
|
border-radius: 16rpx 16rpx 0px 0px;
|
padding: 0 110rpx;
|
|
.nav-items {
|
font-size: 28rpx;
|
font-weight: bold;
|
color: #333333;
|
}
|
|
.nav-items-active {
|
color: #FF002C;
|
}
|
}
|
}
|
|
.noLocation {
|
font-size: 28rpx;
|
font-weight: bold;
|
color: #999999;
|
margin-top: 30rpx;
|
}
|
}
|
}
|
|
|
|
.eleme-item {
|
width: 710rpx;
|
height: 260rpx;
|
background: #FFFFFF;
|
border-radius: 20rpx;
|
padding: 20rpx;
|
box-sizing: border-box;
|
}
|
|
.img {
|
width: 220rpx;
|
height: 220rpx;
|
border-radius: 20rpx;
|
margin-right: 10rpx;
|
}
|
.title {
|
font-size: 30rpx;
|
font-weight: bold;
|
color: #333333;
|
line-height:35rpx;
|
height: 35rpx;
|
display: flex;
|
|
|
}
|
|
.item-title {
|
line-height:35rpx;
|
height: 35rpx;
|
|
}
|
|
.monthly-sales {
|
font-size: 26rpx;
|
font-weight: 500;
|
color: #666666;
|
|
|
}
|
.juli {
|
font-size: 26rpx;
|
font-weight: 500;
|
color: #666666;
|
line-height: 188rpx;
|
}
|
|
/* 下拉刷新 */
|
.loading-more {
|
align-items: center;
|
justify-content: center;
|
/* padding-top: 8px; */
|
padding-bottom: 10px;
|
text-align: center;
|
}
|
|
.loading-more-text {
|
font-size: 28upx;
|
color: #999;
|
}
|
</style>
|