【门店自提列表】

1. 功能实现
pull/1/MERGE
YunaiV 2023-06-29 00:24:30 +08:00
parent 39873a9e3c
commit ec0e0ee234
3 changed files with 127 additions and 154 deletions

11
api/trade/delivery.js Normal file
View File

@ -0,0 +1,11 @@
import request from "@/utils/request.js";
// 获得配送配置
export function getDeliveryConfig() {
return request.get("app-api/trade/delivery/config/get", {});
}
// 获得自提门店列表
export function getDeliveryPickUpStoreList(data) {
return request.get("app-api/trade/delivery/pick-up-store/list", data);
}

View File

@ -2,37 +2,36 @@
<div> <div>
<div class="storeBox" ref="container"> <div class="storeBox" ref="container">
<div class="storeBox-box" v-for="(item, index) in storeList" :key="index" @click.stop="checked(item)"> <div class="storeBox-box" v-for="(item, index) in storeList" :key="index" @click.stop="checked(item)">
<div class="store-img"><img :src="item.image" lazy-load="true" /></div> <div class="store-img">
<img :src="item.logo" lazy-load="true" />
</div>
<div class="store-cent-left"> <div class="store-cent-left">
<div class="store-name">{{ item.name }}</div> <div class="store-name">{{ item.name }}</div>
<div class="store-address line1"> <div class="store-address line1">
{{ item.address }}{{ ", " + item.detailedAddress }} {{ item.areaName }}{{ ", " + item.detailAddress }}
</div> </div>
</div> </div>
<div class="row-right"> <div class="row-right">
<div> <div>
<!-- #ifdef H5 --> <!-- #ifdef H5 -->
<a class="store-phone" :href="'tel:' + item.phone"><span <a class="store-phone" :href="'tel:' + item.phone">
class="iconfont icon-dadianhua01"></span></a> <span class="iconfont icon-dadianhua01" />
</a>
<!-- #endif --> <!-- #endif -->
<!-- #ifdef MP --> <!-- #ifdef MP -->
<view class="store-phone" @click="call(item.phone)"><text <view class="store-phone" @click="call(item.phone)">
class="iconfont icon-dadianhua01"></text></view> <text class="iconfont icon-dadianhua01" />
</view>
<!-- #endif --> <!-- #endif -->
</div> </div>
<!-- <div>
<a class="store-phone" :href="'tel:' + item.phone"><span class="iconfont icon-dadianhua01"></span></a>
</div> -->
<div class="store-distance" @click.stop="showMaoLocation(item)"> <div class="store-distance" @click.stop="showMaoLocation(item)">
<span class="addressTxt" v-if="item.distance">{{ item.distance/1000 }}</span> <span class="addressTxt" v-if="item.distance">{{ item.distance / 1000.0 }}</span>
<span class="addressTxt" v-else></span> <span class="addressTxt" v-else></span>
<span class="iconfont icon-youjian"></span> <span class="iconfont icon-youjian" />
</div> </div>
</div> </div>
</div> </div>
<Loading :loaded="loaded" :loading="loading" />
<Loading :loaded="loaded" :loading="loading"></Loading>
</div> </div>
<div> <div>
<!-- <iframe v-if="locationShow && !isWeixin" ref="geoPage" width="0" height="0" frameborder="0" style="display:none;" <!-- <iframe v-if="locationShow && !isWeixin" ref="geoPage" width="0" height="0" frameborder="0" style="display:none;"
@ -48,24 +47,8 @@
<script> <script>
import Loading from "@/components/Loading"; import Loading from "@/components/Loading";
import { import * as DeliveryApi from '@/api/trade/delivery.js';
storeListApi const LONGITUDE = "user_longitude";
} from "@/api/store";
import {
isWeixin
} from "@/utils/index";
// #ifdef H5
import {
wechatEvevt,
wxShowLocation
} from "@/libs/wechat";
// #endif
import {
mapGetters
} from "vuex";
// import cookie from "@/utils/store/cookie";
const LONGITUDE = "user_longitude";
const LATITUDE = "user_latitude"; const LATITUDE = "user_latitude";
const MAPKEY = "mapKey"; const MAPKEY = "mapKey";
export default { export default {
@ -73,11 +56,8 @@
components: { components: {
Loading Loading
}, },
// computed: mapGetters(["goName"]),
data() { data() {
return { return {
page: 1,
limit: 20,
loaded: false, loaded: false,
loading: false, loading: false,
storeList: [], storeList: [],
@ -103,9 +83,6 @@
this.selfLocation(); this.selfLocation();
this.getList(); this.getList();
} }
// this.$scroll(this.$refs.container, () => {
// !this.loading && this.getList();
// });
}, },
methods: { methods: {
call(phone) { call(phone) {
@ -114,18 +91,17 @@
}); });
}, },
selfLocation() { selfLocation() {
let self = this
// #ifdef H5 // #ifdef H5
if (self.$wechat.isWeixin()) { if (this.$wechat.isWeixin()) {
self.$wechat.location().then(res => { this.$wechat.location().then(res => {
this.user_latitude = res.latitude; this.user_latitude = res.latitude;
this.user_longitude = res.longitude; this.user_longitude = res.longitude;
uni.setStorageSync('user_latitude', res.latitude); uni.setStorageSync('user_latitude', res.latitude);
uni.setStorageSync('user_longitude', res.longitude); uni.setStorageSync('user_longitude', res.longitude);
self.getList(); this.getList();
}) })
} else { } else {
// #endif // #endif
uni.getLocation({ uni.getLocation({
type: 'wgs84', type: 'wgs84',
success: (res) => { success: (res) => {
@ -135,28 +111,27 @@
uni.setStorageSync('user_latitude', res.latitude); uni.setStorageSync('user_latitude', res.latitude);
uni.setStorageSync('user_longitude', res.longitude); uni.setStorageSync('user_longitude', res.longitude);
} catch {} } catch {}
self.getList(); this.getList();
}, },
complete: function() { complete: () => {
self.getList(); this.getList();
} }
}); });
// #ifdef H5 // #ifdef H5
} }
// #endif // #endif
}, },
showMaoLocation(e) { showMaoLocation(e) {
let self = this;
// #ifdef H5 // #ifdef H5
if (self.$wechat.isWeixin()) { if (this.$wechat.isWeixin()) {
self.$wechat.seeLocation({ this.$wechat.seeLocation({
latitude: Number(e.latitude), latitude: Number(e.latitude),
longitude: Number(e.longitude) longitude: Number(e.longitude)
}).then(res => { }).then(res => {
console.log('success'); console.log('success');
}) })
} else { } else {
// #endif // #endif
uni.openLocation({ uni.openLocation({
latitude: Number(e.latitude), latitude: Number(e.latitude),
longitude: Number(e.longitude), longitude: Number(e.longitude),
@ -166,42 +141,38 @@
console.log('success'); console.log('success');
} }
}); });
// #ifdef H5 // #ifdef H5
} }
// #endif // #endif
}, },
// //
/**
* 选中门店
*/
checked(e) { checked(e) {
uni.$emit("handClick", { uni.$emit("handClick", {
address: e address: e
}); });
uni.navigateBack(); uni.navigateBack();
// if (this.goName === "orders") {
// this.$store.commit("GET_STORE", e);
// this.$router.go(-1); //
// }
}, },
// /**
* 获取门店列表数据
*/
getList: function() { getList: function() {
if (this.loading || this.loaded) return; if (this.loading || this.loaded) {
return;
}
this.loading = true; this.loading = true;
let data = { DeliveryApi.getDeliveryPickUpStoreList({
latitude: this.user_latitude || "", // latitude: this.user_latitude,
longitude: this.user_longitude || "", // longitude: this.user_longitude
page: this.page, }).then(res => {
limit: this.limit this.loading = false;
}; this.loaded = res.data.length < this.limit;
storeListApi(data) this.storeList = res.data;
.then(res => { }).catch(err => {
this.loading = false; this.$dialog.error(err);
this.loaded = res.data.list.length < this.limit; });
this.storeList.push.apply(this.storeList, res.data.list);
this.page = this.page + 1;
})
.catch(err => {
this.$dialog.error(err);
});
} }
}, },
onReachBottom() { onReachBottom() {
@ -209,7 +180,6 @@
} }
}; };
</script> </script>
<style> <style>
.geoPage { .geoPage {
position: fixed; position: fixed;

View File

@ -3,10 +3,10 @@
<view class='order-submission'> <view class='order-submission'>
<view class="allAddress" :style="store_self_mention ? '':'padding-top:10rpx;'"> <view class="allAddress" :style="store_self_mention ? '':'padding-top:10rpx;'">
<view class="nav acea-row"> <view class="nav acea-row">
<view class="item font-color" :class="shippingType == 0 ? 'on' : 'on2'" @tap="addressType(0)" <view class="item font-color" :class="shippingType === 0 ? 'on' : 'on2'"
v-if='store_self_mention'></view> @tap="addressType(0)" v-if='store_self_mention' />
<view class="item font-color" :class="shippingType == 1 ? 'on' : 'on2'" @tap="addressType(1)" <view class="item font-color" :class="shippingType === 1 ? 'on' : 'on2'"
v-if='store_self_mention'></view> @tap="addressType(1)" v-if='store_self_mention' />
</view> </view>
<!-- 收货地址的选择 --> <!-- 收货地址的选择 -->
<view class='address acea-row row-between-wrapper' @tap='onAddress' v-if='shippingType === 0' <view class='address acea-row row-between-wrapper' @tap='onAddress' v-if='shippingType === 0'
@ -25,14 +25,14 @@
</view> </view>
<view class='iconfont icon-jiantou'></view> <view class='iconfont icon-jiantou'></view>
</view> </view>
<!-- TODO 芋艿还在搞 --> <!-- 门店的选择 -->
<view class='address acea-row row-between-wrapper' v-else @tap="showStoreList"> <view class='address acea-row row-between-wrapper' v-else @tap="showStoreList">
<block v-if="storeList.length>0"> <block v-if="storeList.length>0">
<view class='addressCon'> <view class='addressCon'>
<view class='name'>{{system_store.name}} <view class='name'>{{ system_store.name }}
<text class='phone'>{{system_store.phone}}</text> <text class='phone'>{{ system_store.phone }}</text>
</view> </view>
<view class="line1"> {{system_store.address}}{{", " + system_store.detailedAddress}} <view class="line1"> {{ system_store.areaName }}{{", " + system_store.detailAddress}}
</view> </view>
</view> </view>
<view class='iconfont icon-jiantou'></view> <view class='iconfont icon-jiantou'></view>
@ -97,10 +97,6 @@
</view> </view>
</view> </view>
</view> </view>
<!-- <view class='item acea-row row-between-wrapper' wx:else>
<view>自提门店</view>
<view class='discount'>{{system_store.name}}</view>
</view> -->
<view class='item' v-if="textareaStatus"> <view class='item' v-if="textareaStatus">
<view>备注信息</view> <view>备注信息</view>
<textarea v-if="coupon.coupon===false" placeholder-class='placeholder' @input='bindHideKeyboard' <textarea v-if="coupon.coupon===false" placeholder-class='placeholder' @input='bindHideKeyboard'
@ -178,10 +174,8 @@
import { import {
openPaySubscribe openPaySubscribe
} from '@/utils/SubscribeMessage.js'; } from '@/utils/SubscribeMessage.js';
import { import * as DeliveryApi from '@/api/trade/delivery.js';
storeListApi import couponListWindow from '@/components/couponListWindow';
} from '@/api/store.js';
import couponListWindow from '@/components/couponListWindow';
import addressWindow from '@/components/addressWindow'; import addressWindow from '@/components/addressWindow';
import orderGoods from '@/components/orderGoods'; import orderGoods from '@/components/orderGoods';
import home from '@/components/home'; import home from '@/components/home';
@ -224,7 +218,6 @@
}, // }, //
couponId: 0, //id couponId: 0, //id
cartId: '', //id
userInfo: {}, // userInfo: {}, //
mark: '', // mark: '', //
couponTitle: '请选择', // couponTitle: '请选择', //
@ -232,45 +225,37 @@
useIntegral: false, //使 useIntegral: false, //使
integral_price: 0, // integral_price: 0, //
integral: 0, integral: 0,
ChangePrice: 0, //使
formIds: [], //formid
status: 0, status: 0,
toPay: false, // toPay: false, //
shippingType: 0,
system_store: {},
storePostage: 0,
contacts: '', contacts: '',
contactsTel: '', contactsTel: '',
mydata: {},
storeList: [],
store_self_mention: 0,
cartInfo: [], cartInfo: [],
priceGroup: {}, priceGroup: {},
animated: false, animated: false,
totalPrice: 0, totalPrice: 0,
integralRatio: "0",
pagesUrl: "", pagesUrl: "",
orderKey: "",
offlinePostage: "", offlinePostage: "",
payChannel: '', payChannel: '',
news: true, bargain: false, //
again: false, combination: false, //
addAgain: false, secKill: false, //
bargain: false, //
combination: false, //
secKill: false, //
orderInfoVo: {}, orderInfoVo: {},
addressList: [], //
orderProNum: 0, orderProNum: 0,
preOrderNo: '', // preOrderNo: '', //
// ========== ========== // ========== ==========
shippingType: 0, // 0 - 1 -
addressId: 0, // param id addressId: 0, // param id
addressInfo: {}, // addressInfo: {}, //
address: { // address: { //
address: false, // addressWindow address: false, // addressWindow
addressId: 0 // address addressId addressId: 0 // address addressId
}, },
// ========== ==========
store_self_mention: false, //
storeList: [], //
system_store: {}, //
}; };
}, },
computed: mapGetters(['isLogin', 'systemPlatform', 'productType']), computed: mapGetters(['isLogin', 'systemPlatform', 'productType']),
@ -334,51 +319,22 @@
this.cartArr[1].title = '可用余额:' + orderInfoVo.userBalance; this.cartArr[1].title = '可用余额:' + orderInfoVo.userBalance;
this.cartArr[1].payStatus = parseInt(res.data.yuePayStatus) === 1 ? 1 : 2; this.cartArr[1].payStatus = parseInt(res.data.yuePayStatus) === 1 ? 1 : 2;
this.cartArr[0].payStatus = parseInt(res.data.payWeixinOpen) === 1 ? 1 : 0; this.cartArr[0].payStatus = parseInt(res.data.payWeixinOpen) === 1 ? 1 : 0;
this.store_self_mention = res.data.storeSelfMention == 'true'&& this.productType === 'normal' ? true : false;
// TODO //
this.$nextTick(function() {
this.$refs.addressWindow.getAddressList();
})
}).catch(err => { }).catch(err => {
return this.$util.Tips({ return this.$util.Tips({
title: err title: err
}); });
}) })
this.$nextTick(function() {
this.$refs.addressWindow.getAddressList(); //
DeliveryApi.getDeliveryConfig().then(res => {
this.store_self_mention = res.data.pickUpEnable && this.productType === 'normal';
}) })
}, },
/**
* 获取门店列表数据
*/
getList: function() {
let longitude = uni.getStorageSync("user_longitude"); //
let latitude = uni.getStorageSync("user_latitude"); //
let data = {
latitude: latitude, //
longitude: longitude, //
page: 1,
limit: 10
}
storeListApi(data).then(res => {
let list = res.data.list || [];
this.$set(this, 'storeList', list);
this.$set(this, 'system_store', list[0]);
}).catch(err => {
return this.$util.Tips({
title: err
});
})
},
/*
* 跳转门店列表
*/
showStoreList: function() {
let _this = this
if (this.storeList.length > 0) {
uni.navigateTo({
url: '/pages/users/goods_details_store/index'
})
}
},
// //
computedPrice: function() { computedPrice: function() {
let shippingType = this.shippingType; let shippingType = this.shippingType;
@ -407,12 +363,6 @@
}); });
}); });
}, },
addressType: function(e) {
let index = e;
this.shippingType = parseInt(index);
this.computedPrice();
if (index == 1) this.getList();
},
bindPickerChange: function(e) { bindPickerChange: function(e) {
let value = e.detail.value; let value = e.detail.value;
this.shippingType = value; this.shippingType = value;
@ -913,6 +863,48 @@
changeClose: function() { changeClose: function() {
this.$set(this.address, 'address', false); this.$set(this.address, 'address', false);
}, },
// ========== ==========
/**
* 切换物流方式
*/
addressType: function(shippingType) {
this.shippingType = shippingType;
this.computedPrice();
if (shippingType === 1) {
this.getList();
}
},
/**
* 跳转门店列表
*/
showStoreList: function() {
if (this.storeList.length > 0) {
uni.navigateTo({
url: '/pages/users/goods_details_store/index'
})
}
},
/**
* 获取门店列表数据
*/
getList: function() {
let longitude = uni.getStorageSync("user_longitude"); //
let latitude = uni.getStorageSync("user_latitude"); //
DeliveryApi.getDeliveryPickUpStoreList({
latitude,
longitude
}).then(res => {
let list = res.data || [];
this.$set(this, 'storeList', list);
this.$set(this, 'system_store', list[0]);
}).catch(err => {
return this.$util.Tips({
title: err
});
})
},
} }
} }
</script> </script>