|
@@ -52,28 +52,26 @@
|
|
|
</navigator>
|
|
|
</view>
|
|
|
<!-- 秒杀楼层 -->
|
|
|
- <seckill></seckill>
|
|
|
+ <!-- <seckill></seckill> -->
|
|
|
<!-- 附近门店 -->
|
|
|
- <view class="store-wrapper">
|
|
|
+ <view class="store-wrapper" v-if="storeList.length != 0">
|
|
|
<view class="title-wrapper flex">
|
|
|
<image src="/static/icon/t2.png" mode=""></image>
|
|
|
<view class="">附近门店</view>
|
|
|
<view class="title-b">门店好物随心购</view>
|
|
|
</view>
|
|
|
- <navigator url="/pages/store/storeDetail" v-for="item in 3">
|
|
|
- <view class="store flex">
|
|
|
- <image src="" mode="" class="store-img"></image>
|
|
|
- <view class="store-info">
|
|
|
- <view class="store-name">鑫旺零售台州店</view>
|
|
|
- <view class="store-detail">台州市椒江区市府大道120号</view>
|
|
|
- <view class="store-tip">门店</view>
|
|
|
- <view class="store-des">
|
|
|
- <image src="" mode=""></image>
|
|
|
- 距离 15KM
|
|
|
- </view>
|
|
|
+ <view class="store flex" v-for="item in storeList" @click="navTo('/pages/store/storeDetail?id=' + item.id)">
|
|
|
+ <image :src="item.image" mode="" class="store-img"></image>
|
|
|
+ <view class="store-info">
|
|
|
+ <view class="store-name">{{ item.name }}</view>
|
|
|
+ <view class="store-detail">{{ item.detailed_address }}</view>
|
|
|
+ <view class="store-tip">门店</view>
|
|
|
+ <view class="store-des">
|
|
|
+ <image src="../../static/icon/dingwei.png" mode=""></image>
|
|
|
+ 距离 {{ item.space }}
|
|
|
</view>
|
|
|
</view>
|
|
|
- </navigator>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
<!-- 好货推荐 -->
|
|
|
<view class="store-wrapper">
|
|
@@ -83,137 +81,17 @@
|
|
|
<view class="title-b">优选商品低价入手</view>
|
|
|
</view>
|
|
|
<view class="goods-wrapper flex">
|
|
|
- <view class="good" v-for="item in 5">
|
|
|
- <image src="" mode="" class="good-img"></image>
|
|
|
- <view class="good-name clamp">无患子植物家居眼罩无患子植物家居眼罩</view>
|
|
|
- <view class="good-info clamp">纯植物无香精</view>
|
|
|
+ <view class="good" v-for="item in bastList" @click="navTo('/pages/product/product?id='+ item.id)">
|
|
|
+ <image :src="item.image" mode="" class="good-img"></image>
|
|
|
+ <view class="good-name clamp">{{ item.store_name }}</view>
|
|
|
+ <!-- <view class="good-info clamp">纯植物无香精</view> -->
|
|
|
<view class="good-price">
|
|
|
- <text class="new-price">¥26.90</text>
|
|
|
- <text class="old-price">¥36</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 精品 商品 -->
|
|
|
- <!-- <view class="f-header m-t">
|
|
|
- <view class="f-left-icon"></view>
|
|
|
- <view class="tit-box"><text class="tit">精品推荐</text></view>
|
|
|
- <navigator url="/pages/product/classify?type=1"><text class="iconfont iconenter">更多</text></navigator>
|
|
|
- </view>
|
|
|
- <view class="guess-section">
|
|
|
- <view v-for="(item, index) in bastList" :key="index" class="guess-item" @click="navToDetailPage(item)">
|
|
|
- <view class="image-wrapper"><image :src="item.image" mode="scaleToFill"></image></view>
|
|
|
- <text class="title clamp margin-c-20">{{ item.store_name }}</text>
|
|
|
- <view class="cmy-hr"></view>
|
|
|
- <view class="price margin-c-20 flex">
|
|
|
- <view>
|
|
|
- <text class="font-size-sm ">¥</text>
|
|
|
- {{ item.price }}
|
|
|
- </view>
|
|
|
- <view class="font-size-sm">
|
|
|
- <text class="font-color-gray">{{ item.sales }}人购买</text>
|
|
|
+ <text class="new-price">{{ item.price }}</text>
|
|
|
+ <text class="old-price">{{ item.ot_price }}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- </view> -->
|
|
|
- <!-- 最新 商品 -->
|
|
|
- <!-- <view class="f-header m-t">
|
|
|
- <view class="f-left-icon"></view>
|
|
|
- <view class="tit-box"><text class="tit">最新商品</text></view>
|
|
|
- <navigator url="/pages/product/classify?type=3"><text class="iconfont iconenter">更多</text></navigator>
|
|
|
</view>
|
|
|
- <view class="guess-section">
|
|
|
- <view v-for="(item, index) in goodsList" :key="index" class="guess-item" @click="navToDetailPage(item)">
|
|
|
- <view class="image-wrapper"><image :src="item.image" mode="scaleToFill"></image></view>
|
|
|
- <text class="title clamp margin-c-20">{{ item.store_name }}</text>
|
|
|
- <view class="cmy-hr"></view>
|
|
|
- <view class="price margin-c-20 flex">
|
|
|
- <view>
|
|
|
- <text class="font-size-sm ">¥</text>
|
|
|
- {{ item.price }}
|
|
|
- </view>
|
|
|
- <view class="font-size-sm">
|
|
|
- <text class="font-color-gray">{{ item.sales }}人购买</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view> -->
|
|
|
- <!-- 促销 商品 -->
|
|
|
- <!-- <view class="f-header m-t">
|
|
|
- <view class="f-left-icon"></view>
|
|
|
- <view class="tit-box"><text class="tit">促销商品</text></view>
|
|
|
- <navigator url="/pages/product/classify?type=4"><text class="iconfont iconenter">更多</text></navigator>
|
|
|
- </view>
|
|
|
- <view class="guess-section">
|
|
|
- <view v-for="(item, index) in bastBanner" :key="index" class="guess-item" @click="navToDetailPage(item)">
|
|
|
- <view class="image-wrapper"><image :src="item.image" mode="scaleToFill"></image></view>
|
|
|
- <text class="title clamp margin-c-20">{{ item.store_name }}</text>
|
|
|
- <view class="cmy-hr"></view>
|
|
|
- <view class="price margin-c-20 flex">
|
|
|
- <view>
|
|
|
- <text class="font-size-sm ">¥</text>
|
|
|
- {{ item.price }}
|
|
|
- </view>
|
|
|
- <view class="font-size-sm">
|
|
|
- <text class="font-color-gray">{{ item.sales }}人购买</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view> -->
|
|
|
- <!-- 会员升级专区 -->
|
|
|
- <!-- <view class="f-header m-t">
|
|
|
- <view class="f-left-icon"></view>
|
|
|
- <view class="tit-box"><text class="tit">会员升级专区</text></view>
|
|
|
- <text class="iconfont iconenter">更多</text>
|
|
|
- </view> -->
|
|
|
- <!-- <view class="uservip flex">
|
|
|
- <image @error="onImageError('userServant', 0)" lazy-load :src="userServant[0].image" mode="aspectFill"></image>
|
|
|
- <view class="detail">
|
|
|
- <view class="title">满园春1999元会员升级礼包</view>
|
|
|
- <view class="icon">自营</view>
|
|
|
- <view class="flex price-box">
|
|
|
- <view class="price">
|
|
|
- <text class="font-size-sm">¥</text>
|
|
|
- 18888
|
|
|
- </view>
|
|
|
- <view class="text">115人购买</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view> -->
|
|
|
-
|
|
|
- <!-- 精品推荐 -->
|
|
|
- <!-- <view class="f-header m-t">
|
|
|
- <view class="f-left-icon"></view>
|
|
|
- <view class="tit-box"><text class="tit">精品推荐</text></view>
|
|
|
- <text class="iconfont iconenter">更多</text>
|
|
|
- </view> -->
|
|
|
- <!-- <view class="guess-section">
|
|
|
- <view v-for="(item, index) in goodsList" :key="index" class="guess-item" @click="navToDetailPage(item)">
|
|
|
- <view class="image-wrapper"><image @error="onImageError('goodsList', index)" lazy-load :src="item.image" mode="aspectFill"></image></view>
|
|
|
- <text class="title clamp margin-c-20">
|
|
|
- <text class="icon">自营</text>
|
|
|
- {{ item.title }}
|
|
|
- </text>
|
|
|
- <view class="hr"></view>
|
|
|
- <view class="price margin-c-20 flex">
|
|
|
- <view>
|
|
|
- <text class="font-size-sm ">¥</text>
|
|
|
- {{ item.price }}
|
|
|
- </view>
|
|
|
- <view class="font-size-sm">
|
|
|
- <view class='detail'>
|
|
|
- <text class="icon">代理价</text>
|
|
|
- <text></text>
|
|
|
- </view>
|
|
|
- <view class="detail">
|
|
|
- <text class="font-color-yellow">会员价</text>
|
|
|
- <text class="font-color-yellow">7.5折</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="tip">兑换价¥44+44积分</view>
|
|
|
- </view>
|
|
|
- </view> -->
|
|
|
<view class="Mask" v-show="shareShow">
|
|
|
<image @click="share" src="http://shicai.liuniu946.com/static/img/shareimg4.png"></image>
|
|
|
<view class="Toshare" @click="Toshare"></view>
|
|
@@ -223,17 +101,17 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import seckill from '../../components/seckill/seckill.vue';
|
|
|
-import { loadIndexs } from '@/api/index.js';
|
|
|
+import { timeComputed, space, openMap } from '@/utils/rocessor.js';
|
|
|
+import { loadIndexs, getStoreList } from '@/api/index.js';
|
|
|
import { getUserInfo } from '@/api/user.js';
|
|
|
import { setCoupons } from '@/api/functionalUnit.js';
|
|
|
-import { getBargainList } from '@/api/product.js';
|
|
|
+import { getBargainList, getProducts } from '@/api/product.js';
|
|
|
import { interceptor } from '@/utils/loginUtils';
|
|
|
-import { mapState } from 'vuex';
|
|
|
+import { mapState, mapMutations } from 'vuex';
|
|
|
|
|
|
export default {
|
|
|
components: {
|
|
|
- seckill
|
|
|
+ // seckill
|
|
|
},
|
|
|
watch: {
|
|
|
//自适应swiper高度
|
|
@@ -251,7 +129,7 @@ export default {
|
|
|
let bHeight = Math.ceil(obj.bastBanner.length / 2);
|
|
|
obj.swiperHeight = Math.ceil(obj.pageProportion * 520 * bHeight);
|
|
|
}
|
|
|
- },
|
|
|
+ }
|
|
|
// 初次加载页面高度时修改页面高度
|
|
|
// bastList(newValue, oldValue) {
|
|
|
// let obj = this;
|
|
@@ -274,6 +152,7 @@ export default {
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ storeList: [], //门店列表
|
|
|
shareShow: false, //分享海报
|
|
|
pageProportion: 0, //保存页面基于750宽度的比例
|
|
|
swiperHeight: 0,
|
|
@@ -317,7 +196,8 @@ export default {
|
|
|
},
|
|
|
computed: {
|
|
|
...mapState(['loginInterceptor']),
|
|
|
- ...mapState('user', ['hasLogin', 'userInfo'])
|
|
|
+ ...mapState('user', ['hasLogin', 'userInfo']),
|
|
|
+ ...mapState('latlon', ['lat', 'lon'])
|
|
|
},
|
|
|
onLoad: function(option) {
|
|
|
// #ifndef MP
|
|
@@ -335,6 +215,7 @@ export default {
|
|
|
});
|
|
|
}
|
|
|
// #endif
|
|
|
+ this.getaddress();
|
|
|
},
|
|
|
onShow: function() {
|
|
|
// 判断是否强制登录
|
|
@@ -344,6 +225,7 @@ export default {
|
|
|
}
|
|
|
this.loadData();
|
|
|
this.getBargainList();
|
|
|
+ // this.getProducts()
|
|
|
},
|
|
|
//下拉刷新
|
|
|
onPullDownRefresh() {
|
|
@@ -376,6 +258,12 @@ export default {
|
|
|
},
|
|
|
// #endif
|
|
|
methods: {
|
|
|
+ navTo(url) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: url
|
|
|
+ })
|
|
|
+ },
|
|
|
+ ...mapMutations('latlon', ['setLat', 'setLon']),
|
|
|
navToTab(url) {
|
|
|
uni.switchTab({
|
|
|
url: url
|
|
@@ -515,6 +403,7 @@ export default {
|
|
|
this.menusList = data.menus;
|
|
|
this.goodsList = goods.firstList; //最新商品
|
|
|
this.bastList = goods.bastList; //精品推荐
|
|
|
+ console.log(this.bastList, 'this.bastList6666666666666666666666');
|
|
|
this.bastBanner = data.benefit; //促销单品
|
|
|
this.$set(this, 'couponArray', data.couponList); //保存卡包券
|
|
|
|
|
@@ -549,6 +438,58 @@ export default {
|
|
|
uni.navigateTo({
|
|
|
url: item.wap_url
|
|
|
});
|
|
|
+ },
|
|
|
+ //获取定位信息
|
|
|
+ getaddress() {
|
|
|
+ let obj = this;
|
|
|
+ uni.getLocation({
|
|
|
+ success: res => {
|
|
|
+ let latitude = Math.abs(res.latitude);
|
|
|
+ let longitude = Math.abs(res.longitude);
|
|
|
+ obj.setLat(latitude);
|
|
|
+ obj.setLon(longitude);
|
|
|
+ console.log(obj.lat, obj.lon, '经纬度数据');
|
|
|
+ obj.getStoreList(latitude, longitude);
|
|
|
+ },
|
|
|
+ fail: err => {
|
|
|
+ openMap().then(e => {
|
|
|
+ this.getaddress();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //获取门店列表
|
|
|
+ getStoreList(latitude, longitude) {
|
|
|
+ let obj = this;
|
|
|
+ getStoreList({
|
|
|
+ page: 1,
|
|
|
+ limit: 3,
|
|
|
+ latitude: latitude,
|
|
|
+ longitude: longitude
|
|
|
+ }).then(({ data }) => {
|
|
|
+ data.list = data.list.map(item => {
|
|
|
+ item.space = obj.space(obj.lat, obj.lon, item.latitude, item.longitude);
|
|
|
+ console.log(item.space, 'item.space++++++++++');
|
|
|
+ return item;
|
|
|
+ });
|
|
|
+ obj.storeList = data.list;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ space(lat1, lng1, lat2, lng2) {
|
|
|
+ console.log(lat1, lng1, lat2, lng2, '位置信息');
|
|
|
+ var radLat1 = (lat1 * Math.PI) / 180.0;
|
|
|
+ var radLat2 = (lat2 * Math.PI) / 180.0;
|
|
|
+ var a = radLat1 - radLat2;
|
|
|
+ var b = (lng1 * Math.PI) / 180.0 - (lng2 * Math.PI) / 180.0;
|
|
|
+ var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) + Math.cos(radLat1) * Math.cos(radLat2) * Math.pow(Math.sin(b / 2), 2)));
|
|
|
+ s = s * 6378.137;
|
|
|
+ s = Math.round(s * 10000) / 10000;
|
|
|
+ // return s * 1000;
|
|
|
+ if (s > 1) {
|
|
|
+ return s.toFixed(2) + 'km';
|
|
|
+ } else {
|
|
|
+ return s * 1000 + 'm'; // 单位米
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
};
|
|
@@ -1209,7 +1150,7 @@ page {
|
|
|
.good {
|
|
|
margin-bottom: 20rpx;
|
|
|
width: 345rpx;
|
|
|
- height: 540rpx;
|
|
|
+ height: 480rpx;
|
|
|
background: #ffffff;
|
|
|
box-shadow: 0px 0px 10rpx rgba(50, 50, 52, 0.2);
|
|
|
border-radius: 10rpx;
|
|
@@ -1217,7 +1158,6 @@ page {
|
|
|
width: 345rpx;
|
|
|
height: 345rpx;
|
|
|
border-radius: 10rpx;
|
|
|
- background-color: red;
|
|
|
}
|
|
|
.good-name {
|
|
|
font-size: 30rpx;
|
|
@@ -1271,7 +1211,7 @@ page {
|
|
|
width: 180rpx;
|
|
|
height: 180rpx;
|
|
|
border-radius: 10rpx;
|
|
|
- background-color: red;
|
|
|
+ // background-color: red;
|
|
|
}
|
|
|
.store-info {
|
|
|
width: 100%;
|
|
@@ -1319,7 +1259,6 @@ page {
|
|
|
margin-right: 8rpx;
|
|
|
width: 17rpx;
|
|
|
height: 24rpx;
|
|
|
- background-color: red;
|
|
|
}
|
|
|
}
|
|
|
}
|