【确认页,选择地址】

1. 功能实现
pull/1/MERGE
YunaiV 2023-06-26 20:52:27 +08:00
parent e08f65b4cb
commit c23e1922a3
4 changed files with 144 additions and 232 deletions

View File

@ -7,6 +7,11 @@ export function getAddress(id) {
}); });
} }
// 获得默认的用户收件地址
export function getDefaultUserAddress() {
return request.get('app-api/member/address/get-default', {});
}
// 获得用户收件地址列表 // 获得用户收件地址列表
export function getAddressList() { export function getAddressList() {
return request.get('app-api/member/address/list', {}); return request.get('app-api/member/address/list', {});

View File

@ -243,40 +243,6 @@ export function userLevelDetection(){
return request.get('user/level/detection'); return request.get('user/level/detection');
} }
/**
*
* 地址列表
* @param object data
*/
export function getAddressList(data){
return request.get('address/list',data);
}
/**
* 设置默认地址
* @param int id
*/
export function setAddressDefault(id){
return request.post('address/default/set',{id:id})
}
/**
* 修改 添加地址
* @param object data
*/
export function editAddress(data){
return request.post('address/edit',data);
}
/**
* 删除地址
* @param int id
*
*/
export function delAddress(id){
return request.post('address/del',{id:id})
}
/** /**
* 获取单个地址 * 获取单个地址
* @param int id * @param int id

View File

@ -3,14 +3,17 @@
<view class="address-window" :class="address.address ? 'on' : ''"> <view class="address-window" :class="address.address ? 'on' : ''">
<view class='title'>选择地址<text class='iconfont icon-guanbi' @tap='close'></text></view> <view class='title'>选择地址<text class='iconfont icon-guanbi' @tap='close'></text></view>
<view class='list'> <view class='list'>
<view class='item acea-row row-between-wrapper' :class='active==index?"font-color":""' v-for="(item,index) in addressList" <view class='item acea-row row-between-wrapper' :class='active === index?"font-color":""'
@tap='tapAddress(index,item.id)' :key='index'> v-for="(item,index) in addressList" @tap='tapAddress(index,item.id)' :key='index'>
<text class='iconfont icon-ditu' :class='active==index?"font-color":""'></text> <text class='iconfont icon-ditu' :class='active===index?"font-color":""' />
<view class='address'> <view class='address'>
<view class='name' :class='active==index?"font-color":""'>{{item.realName}}<text class='phone'>{{item.phone}}</text></view> <view class='name' :class='active==index?"font-color":""'>
<view class='line1'>{{item.province}}{{item.city}}{{item.district}}{{item.detail}}</view> {{ item.name }}
<text class='phone'>{{ item.mobile }}</text>
</view>
<view class='line1'>{{ item.areaName }} {{ item.detailAddress }}</view>
</view> </view>
<text class='iconfont icon-complete' :class='active==index?"font-color":""'></text> <text class='iconfont icon-complete' :class='active === index?"font-color":""' />
</view> </view>
</view> </view>
<!-- 无地址 --> <!-- 无地址 -->
@ -24,10 +27,8 @@
</template> </template>
<script> <script>
import { import * as AddressApi from '@/api/member/address.js';
getAddressList export default {
} from '@/api/user.js';
export default {
props: { props: {
pagesUrl: { pagesUrl: {
type: String, type: String,
@ -49,58 +50,54 @@
}, },
data() { data() {
return { return {
active: 0, active: 0, // addressList
is_loading: true, is_loading: true,
addressList: [] addressList: []
}; };
}, },
methods: { methods: {
/**
* 选中某个地址
*/
tapAddress: function(e, addressid) { tapAddress: function(e, addressid) {
this.active = e; this.active = e;
let a = {}; for (let i = 0; i < this.addressList.length; i++) {
for (let i = 0, leng = this.addressList.length; i < leng; i++) {
if (this.addressList[i].id === addressid) { if (this.addressList[i].id === addressid) {
a = this.addressList[i]; this.$emit('OnChangeAddress', this.addressList[i]);
} break
}
} }
this.$emit('OnChangeAddress', a);
}, },
close: function() { close: function() {
this.$emit('changeClose'); this.$emit('changeClose');
this.$emit('changeTextareaStatus');
}, },
goAddressPages: function() { goAddressPages: function() {
this.$emit('changeClose'); this.$emit('changeClose');
this.$emit('changeTextareaStatus');
uni.navigateTo({ uni.navigateTo({
url: this.pagesUrl url: this.pagesUrl
}); });
}, },
getAddressList: function() { getAddressList: function() {
let that = this; AddressApi.getAddressList().then(res => {
getAddressList({ const addressList = res.data;
page: 1, this.$set(this, 'addressList', addressList);
limit: 5 this.is_loading = false;
}).then(res => { //
let addressList = res.data.list; if (!this.address.addressId) {
that.$set(that, 'addressList', addressList); return;
that.is_loading = false; }
let defaultAddress = {}; let defaultAddress = {};
// for (let i = 0; i < addressList.length; i++) {
if(!that.address.addressId) return; if (addressList[i].id === this.address.addressId) {
for (let i = 0, leng = addressList.length; i < leng; i++) { this.active = i;
if (addressList[i].id == that.address.addressId) {
that.active = i;
defaultAddress = this.addressList[i]; defaultAddress = this.addressList[i];
} }
} }
this.$emit('OnDefaultAddress', defaultAddress);
}) })
} }
} }
} }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.address-window { .address-window {
background-color: #fff; background-color: #fff;

View File

@ -8,15 +8,16 @@
<view class="item font-color" :class="shippingType == 1 ? 'on' : 'on2'" @tap="addressType(1)" <view class="item font-color" :class="shippingType == 1 ? 'on' : 'on2'" @tap="addressType(1)"
v-if='store_self_mention'></view> v-if='store_self_mention'></view>
</view> </view>
<view class='address acea-row row-between-wrapper' @tap='onAddress' v-if='shippingType == 0' :style="store_self_mention ? '':'border-top-left-radius: 14rpx;border-top-right-radius: 14rpx;'"> <!-- 收货地址的选择 -->
<view class='addressCon' v-if="addressInfo.realName"> <view class='address acea-row row-between-wrapper' @tap='onAddress' v-if='shippingType === 0'
<view class='name'>{{addressInfo.realName}} :style="store_self_mention ? '':'border-top-left-radius: 14rpx;border-top-right-radius: 14rpx;'">
<text class='phone'>{{addressInfo.phone}}</text> <view class='addressCon' v-if="addressInfo.name">
<view class='name'>{{ addressInfo.name }}
<text class='phone'>{{ addressInfo.mobile }}</text>
</view> </view>
<view class="acea-row"> <view class="acea-row">
<text class='default font-color' <text class='default font-color' v-if="addressInfo.defaultStatus">[]</text>
v-if="addressInfo.isDefault">[默认]</text> <text class="line2">{{ addressInfo.areaName }} {{addressInfo.detailAddress}}</text>
<text class="line2">{{addressInfo.province}}{{addressInfo.city}}{{addressInfo.district}}{{addressInfo.detail}}</text>
</view> </view>
</view> </view>
<view class='addressCon' v-else> <view class='addressCon' v-else>
@ -24,6 +25,7 @@
</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'>
@ -84,7 +86,7 @@
<view>联系人</view> <view>联系人</view>
<view class="discount textR"> <view class="discount textR">
<input type="text" placeholder="请填写您的联系姓名" placeholder-style="color:#ccc;" placeholder-class="placeholder" <input type="text" placeholder="请填写您的联系姓名" placeholder-style="color:#ccc;" placeholder-class="placeholder"
@blur='realName'></input> @blur='realName' />
</view> </view>
</view> </view>
<view class="item acea-row row-between-wrapper"> <view class="item acea-row row-between-wrapper">
@ -151,17 +153,20 @@
</view> </view>
</view> </view>
<couponListWindow :coupon='coupon' @ChangCouponsClone="ChangCouponsClone" :openType='openType' @ChangCoupons="ChangCoupons" :orderShow="orderShow"></couponListWindow> <couponListWindow :coupon='coupon' @ChangCouponsClone="ChangCouponsClone" :openType='openType' @ChangCoupons="ChangCoupons" :orderShow="orderShow"></couponListWindow>
<addressWindow ref="addressWindow" @changeTextareaStatus="changeTextareaStatus" :address='address'
:pagesUrl="pagesUrl" @OnDefaultAddress="OnDefaultAddress" @OnChangeAddress="OnChangeAddress" @changeClose="changeClose"></addressWindow> <!-- 收货地址的弹窗选择 -->
<!-- #ifdef MP --> <addressWindow
<!-- <authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize> --> ref="addressWindow"
<!-- #endif --> :address='address'
:pagesUrl="pagesUrl"
@OnChangeAddress="OnChangeAddress"
@changeClose="changeClose"
/>
<home></home> <home></home>
</view> </view>
</template> </template>
<script> <script>
import { import {
//orderConfirm,
getCouponsOrderPrice, getCouponsOrderPrice,
orderCreate, orderCreate,
postOrderComputed, postOrderComputed,
@ -169,42 +174,25 @@
wechatQueryPayResult, wechatQueryPayResult,
loadPreOrderApi loadPreOrderApi
} from '@/api/order.js'; } from '@/api/order.js';
import { import * as AddressApi from '@/api/member/address.js';
getAddressList,
getAddressDetail
} from '@/api/user.js';
import { import {
openPaySubscribe openPaySubscribe
} from '@/utils/SubscribeMessage.js'; } from '@/utils/SubscribeMessage.js';
import { import {
storeListApi storeListApi
} from '@/api/store.js'; } from '@/api/store.js';
import {
CACHE_LONGITUDE,
CACHE_LATITUDE
} from '@/config/cache.js';
import couponListWindow from '@/components/couponListWindow'; 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';
import { import { toLogin } from '@/libs/login.js';
toLogin import { mapGetters } from "vuex";
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
export default { export default {
components: { components: {
couponListWindow, couponListWindow,
addressWindow, addressWindow,
orderGoods, orderGoods,
home, home
// #ifdef MP
authorize
// #endif
}, },
data() { data() {
return { return {
@ -225,13 +213,6 @@
title: '可用余额:', title: '可用余额:',
payStatus: 1, payStatus: 1,
} }
// {
// "name": "线", //offlinePayStatu1线2offlinePostagetrue
// "icon": "icon-yinhangqia",
// value: 'offline',
// title: '线',
// payStatus: 1,
// },
], ],
payType: 'weixin', // payType: 'weixin', //
openType: 1, // 1=使 openType: 1, // 1=使
@ -241,12 +222,7 @@
list: [], list: [],
statusTile: '立即使用' statusTile: '立即使用'
}, // }, //
address: {
address: false,
addressId: 0
}, //
addressInfo: {}, //
addressId: 0, //id
couponId: 0, //id couponId: 0, //id
cartId: '', //id cartId: '', //id
userInfo: {}, // userInfo: {}, //
@ -259,7 +235,6 @@
ChangePrice: 0, //使 ChangePrice: 0, //使
formIds: [], //formid formIds: [], //formid
status: 0, status: 0,
is_address: false,
toPay: false, // toPay: false, //
shippingType: 0, shippingType: 0,
system_store: {}, system_store: {},
@ -276,10 +251,7 @@
integralRatio: "0", integralRatio: "0",
pagesUrl: "", pagesUrl: "",
orderKey: "", orderKey: "",
// usableCoupon: {},
offlinePostage: "", offlinePostage: "",
isAuto: false, //
isShowAuth: false, //
payChannel: '', payChannel: '',
news: true, news: true,
again: false, again: false,
@ -290,8 +262,16 @@
orderInfoVo: {}, orderInfoVo: {},
addressList: [], // addressList: [], //
orderProNum: 0, orderProNum: 0,
preOrderNo: '' // preOrderNo: '', //
};
// ========== ==========
addressId: 0, // param id
addressInfo: {}, //
address: { //
address: false, // addressWindow
addressId: 0 // address addressId
},
};
}, },
computed: mapGetters(['isLogin', 'systemPlatform', 'productType']), computed: mapGetters(['isLogin', 'systemPlatform', 'productType']),
watch: { watch: {
@ -299,45 +279,39 @@
handler: function(newV, oldV) { handler: function(newV, oldV) {
if (newV) { if (newV) {
this.getloadPreOrder(); this.getloadPreOrder();
//this.getaddressInfo(); this.getaddressInfo();
} }
}, },
deep: true deep: true
} }
}, },
onLoad(options) { onLoad(options) {
if (!this.isLogin) {
toLogin();
return
}
// #ifdef H5 // #ifdef H5
this.payChannel = this.$wechat.isWeixin() ? 'public' : 'weixinh5'; this.payChannel = this.$wechat.isWeixin() ? 'public' : 'weixinh5';
// #endif // #endif
// #ifdef MP // #ifdef MP
this.payChannel = 'routine'; this.payChannel = 'routine';
// #endif // #endif
// if (!options.cartId) return this.$util.Tips({ this.preOrderNo = options.preOrderNo || 0;
// title: '' this.getloadPreOrder();
// }, {
// tab: 3, // address
// url: 1 this.addressId = options.addressId || 0;
// }); this.getaddressInfo();
this.preOrderNo = options.preOrderNo || 0;
this.addressId = options.addressId || 0;
this.is_address = options.is_address ? true : false;
if (this.isLogin) {
//this.getaddressInfo();
this.getloadPreOrder();
} else {
toLogin();
}
}, },
/** /**
* 生命周期函数--监听页面显示 * 生命周期函数--监听页面显示
*/ */
onShow: function() { onShow: function() {
let _this = this let _this = this
// wx.getLaunchOptionsSync
this.textareaStatus = true; this.textareaStatus = true;
if (this.isLogin && this.toPay == false) { if (this.isLogin && !this.toPay) {
//this.getaddressInfo(); this.getaddressInfo();
} }
uni.$on("handClick", res => { uni.$on("handClick", res => {
@ -347,21 +321,7 @@
// //
uni.$off('handClick'); uni.$off('handClick');
}) })
// let pages = getCurrentPages();
// let currPage = pages[pages.length - 1]; //
// if (currPage.data.storeItem) {
// let json = currPage.data.storeItem;
// this.$set(this, 'system_store', json);
// }
}, },
/**
* 生命周期函数--监听页面隐藏
*/
// onHide: function() {
// console.log(999);
// this.isClose = true
// },
methods: { methods: {
// //
getloadPreOrder: function() { getloadPreOrder: function() {
@ -375,24 +335,16 @@
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; this.store_self_mention = res.data.storeSelfMention == 'true'&& this.productType === 'normal' ? true : false;
//
this.$nextTick(function() { // TODO
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();
* 授权回调事件 })
*
*/
onLoadFun: function() {
//this.getaddressInfo();
//
// this.$scope.selectComponent('#address-window').getAddressList();
}, },
/** /**
* 获取门店列表数据 * 获取门店列表数据
@ -416,15 +368,10 @@
}); });
}) })
}, },
//
changeClose: function() {
this.$set(this.address, 'address', false);
},
/* /*
* 跳转门店列表 * 跳转门店列表
*/ */
showStoreList: function() { showStoreList: function() {
let _this = this let _this = this
if (this.storeList.length > 0) { if (this.storeList.length > 0) {
uni.navigateTo({ uni.navigateTo({
@ -485,7 +432,6 @@
}, },
/** /**
* 处理点击优惠券后的事件 * 处理点击优惠券后的事件
*
*/ */
ChangCoupons: function(e) { ChangCoupons: function(e) {
// this.usableCoupon = e // this.usableCoupon = e
@ -524,26 +470,6 @@
this.useIntegral = !this.useIntegral; this.useIntegral = !this.useIntegral;
this.computedPrice(); this.computedPrice();
}, },
/**
* 首次进页面展示默认地址
*/
OnDefaultAddress: function(e) {
this.addressInfo = e;
this.address.addressId = e.id;
},
/**
* 选择地址后改变事件
* @param object e
*/
OnChangeAddress: function(e) {
this.addressInfo = e;
this.address.addressId = e.id;
this.textareaStatus = true;
//this.orderInfoVo.addressId = e;
this.address.address = false;
//this.getaddressInfo();
this.computedPrice();
},
bindHideKeyboard: function(e) { bindHideKeyboard: function(e) {
this.mark = e.detail.value; this.mark = e.detail.value;
}, },
@ -557,31 +483,6 @@
this.openType = 1; this.openType = 1;
}); });
}, },
/*
* 获取默认收货地址或者获取某条地址信息
*/
getaddressInfo: function() {
let that = this;
if (that.addressId) {
getAddressDetail(that.addressId).then(res => {
if (res.data) {
res.data.isDefault = parseInt(res.data.isDefault);
that.addressInfo = res.data || {};
that.addressId = res.data.id || 0;
that.address.addressId = res.data.id || 0;
}
})
} else {
getAddressDefault().then(res => {
if (res.data) {
res.data.isDefault = parseInt(res.data.isDefault);
that.addressInfo = res.data || {};
that.addressId = res.data.id || 0;
that.address.addressId = res.data.id || 0;
}
})
}
},
payItem: function(e) { payItem: function(e) {
let that = this; let that = this;
let active = e; let active = e;
@ -601,12 +502,6 @@
let that = this; let that = this;
that.animated = false; that.animated = false;
}, },
onAddress: function() {
let that = this;
that.textareaStatus = false;
that.address.address = true;
that.pagesUrl = '/pages/users/user_address_list/index?preOrderNo='+ this.preOrderNo;
},
realName: function(e) { realName: function(e) {
this.contacts = e.detail.value; this.contacts = e.detail.value;
}, },
@ -968,8 +863,57 @@
// #ifndef MP // #ifndef MP
that.payment(data); that.payment(data);
// #endif // #endif
} },
}
// ========== ==========
/**
* 打开选择地址的弹窗
*/
onAddress: function() {
this.textareaStatus = false;
this.address.address = true;
this.pagesUrl = '/pages/users/user_address_list/index?preOrderNo='+ this.preOrderNo;
},
/**
* 选择地址后改变事件
*/
OnChangeAddress: function(e) {
this.addressInfo = e;
this.address.addressId = e.id;
this.textareaStatus = true;
this.address.address = false;
this.getaddressInfo();
this.computedPrice();
},
/**
* 获取默认收货地址或者获取某条地址信息
*/
getaddressInfo: function() {
if (this.addressId) {
AddressApi.getAddress(this.addressId).then(res => {
if (res.data) {
this.addressInfo = res.data || {};
this.addressId = res.data.id || 0;
this.address.addressId = res.data.id || 0;
}
})
} else {
AddressApi.getDefaultUserAddress().then(res => {
if (res.data) {
this.addressInfo = res.data || {};
this.addressId = res.data.id || 0;
this.address.addressId = res.data.id || 0;
}
})
}
},
/**
* 关闭地址弹窗
*/
changeClose: function() {
this.$set(this.address, 'address', false);
},
}
} }
</script> </script>