<template>
|
<view>
|
<!-- #ifdef APP-->
|
<view class='status_1'></view>
|
<!-- #endif -->
|
<!-- <view class='line'>
|
<image src='https://ossacmall.bluedeer.com.cn/app/static/images/line.jpg' v-if="addressList.length"></image>
|
</view> -->
|
<view v-if="orderId" class="orderTips">订单地址1小时内可修改，请确认信息准确性</view>
|
<view class='address-management' :class='addressList.length < 1 && page > 1 ? "fff":""'>
|
<radio-group class="radio-group" v-if="addressList.length">
|
<view class='item borRadius14' v-for="(item,index) in addressList" :key="index">
|
<view class='address' @click='goOrder(item)'>
|
<view class='consignee'>{{item.realName}}<text class='phone'>{{item.phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')}}</text></view>
|
<view>{{item.province}}{{item.city}}{{item.district}}{{item.detail}}</view>
|
</view>
|
<view class='operation acea-row row-between-wrapper'>
|
<view class="radio" :class="{'is-default':item.isDefault}">
|
<switch :checked="item.isDefault" color="#04C763" @change="radioChange(index)" style="transform:scale(0.8)" />
|
<text>默认地址</text>
|
</view>
|
<!-- #ifndef MP -->
|
<!-- <radio class="radio" :value="index.toString()" :checked="item.isDefault">
|
<text>设为默认</text>
|
</radio> -->
|
<!-- #endif -->
|
<!-- #ifdef MP -->
|
<!-- <radio class="radio" :value="index" :checked="item.isDefault">
|
<text>设为默认</text>
|
</radio> -->
|
<!-- #endif -->
|
<view class='acea-row row-middle'>
|
<view class="btn btn-shanchu" @click='delAddress(index)'>
|
<!-- <text class='iconfont icon-shanchu'></text> -->删除
|
</view>
|
<view class="btn btn-bianji" @click='editAddress(item.id)'>
|
<!-- <text class='iconfont icon-bianji'></text> -->编辑
|
</view>
|
</view>
|
</view>
|
</view>
|
</radio-group>
|
<view class='loadingicon acea-row row-center-wrapper' v-if="addressList.length">
|
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
|
</view>
|
<view class='noCommodity' v-if="addressList.length < 1 && page > 1">
|
<view class='pictrue'>
|
<image src='https://ossacmall.bluedeer.com.cn/app/static/images/noAddress.png'></image>
|
</view>
|
</view>
|
<view style='height:120rpx;'></view>
|
</view>
|
<view class='footer acea-row row-between-wrapper'>
|
<!-- #ifdef MP-->
|
<view class='addressBnt wxbnt' @click='getWxAddress'>
|
<!-- <text class='iconfont icon-weixin2'></text> -->微信导入
|
</view>
|
<view class='addressBnt xzbnt' @click='addAddress'>
|
<!-- <text class='iconfont icon-tianjiadizhi'></text> -->新增地址
|
</view>
|
<!-- #endif -->
|
<!-- #ifdef H5-->
|
<!-- <view class='addressBnt wxbnt' @click='getAddress'><text class='iconfont icon-weixin2'></text>微信导入</view> -->
|
<!--<view class='addressBnt xzbnt' @click='addAddress'> <text class='iconfont icon-tianjiadizhi'></text>新增地址</view> -->
|
|
|
<view v-if="this.$wechat.isWeixin()" class='addressBnt wxbnt' @click='getAddress'>微信导入</view>
|
<view class='addressBnt xzbnt' :class="this.$wechat.isWeixin()?'':'on'" @click='addAddress'>新增地址</view>
|
|
<!-- #endif -->
|
|
|
<!-- #ifdef APP-->
|
<view class='addressBnt on xzbnt' @click='addAddress'>
|
<!-- <text class='iconfont icon-tianjiadizhi'></text> -->新增地址
|
</view>
|
<!-- #endif -->
|
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import {
|
getAddressList,
|
setAddressDefault,
|
delAddress,
|
editAddress,
|
postAddress,
|
updateAddress,
|
} from '@/api/user.js';
|
import {
|
toLogin
|
} from '@/libs/login.js';
|
import {
|
mapGetters
|
} from "vuex";
|
import home from '@/components/home';
|
export default {
|
components: {
|
home
|
},
|
data() {
|
return {
|
addressList: [],
|
cartId: '',
|
pinkId: 0,
|
couponId: 0,
|
loading: false,
|
loadend: false,
|
loadTitle: '加载更多',
|
page: 1,
|
limit: 20,
|
isAuto: false, //没有授权的不会自动授权
|
isShowAuth: false, //是否隐藏授权
|
bargain: false, //是否是砍价
|
combination: false, //是否是拼团
|
secKill: false, //是否是秒杀
|
isPageShow: false,
|
loginBackFn: null,
|
loadingWechartAddress: false,
|
preOrderNo:0,
|
orderId:0,
|
dataId:0
|
};
|
},
|
onShow: function() {
|
let that = this;
|
that.isPageShow = true;
|
let pages = getCurrentPages(),
|
currPage = pages[pages.length - 1];
|
console.log('------------------page onShow start-----------------');
|
console.log('route', currPage.route);
|
console.log('options', currPage.options);
|
console.log('------------------page onShow end-----------------');
|
this.preOrderNo = currPage.options.preOrderNo || 0;
|
this.orderId=currPage.options.orderId||0;
|
this.dataId=currPage.options.dataId||0;
|
if (that.$store.getters.isBelong) {
|
that.belongInfoReadyFn({
|
isRegister: false
|
})
|
} else {
|
uni.$once('BELONG_READY', that.belongInfoReadyFn);
|
}
|
},
|
onHide: function() {
|
let that = this;
|
that.isPageShow = false;
|
uni.$off('loginFlSuccess', that.registerFn);
|
uni.$off('BELONG_READY', that.belongInfoReadyFn);
|
},
|
methods: {
|
belongInfoReadyFn(data) {
|
let that = this;
|
if (!data.isRegister) {
|
that.checkLoginFn()
|
} else {
|
that.onLoadFn();
|
}
|
},
|
checkLoginFn() {
|
let that = this;
|
let pages = getCurrentPages(),
|
currPage = pages[pages.length - 1];
|
that.addTrack('yy_pageView', {
|
pageTitle_var: '地址管理',
|
pagePath_var: currPage.$page.fullPath,
|
pageType_var: '地址管理'
|
});
|
|
if (that.$store.getters.isLogin) {
|
that.onLoadFn();
|
} else {
|
toLogin(that);
|
}
|
that.loginBackFn = function() {
|
that.onLoadFn();
|
}
|
uni.$once('loginFlSuccess', that.registerFn);
|
},
|
registerFn() {
|
console.log('registerFn');
|
let that = this;
|
if (that.loginBackFn) {
|
that.loginBackFn();
|
}
|
that.loginBackFn = null;
|
},
|
onLoadFn: function() {
|
this.getAddressList(true);
|
},
|
// 授权关闭
|
authColse: function(e) {
|
this.isShowAuth = e
|
},
|
/*
|
* 导入微信地址（小程序）
|
*/
|
getWxAddress: function() {
|
let that = this;
|
clearTimeout(that.loadingWechartAddress)
|
that.loadingWechartAddress=setTimeout(()=>{
|
uni.authorize({
|
scope: 'scope.address',
|
success: function(res) {
|
uni.chooseAddress({
|
success: function(res) {
|
let addressP = {};
|
addressP.province = res.provinceName;
|
addressP.city = res.cityName;
|
addressP.district = res.countyName;
|
addressP.cityId = 0;
|
editAddress({
|
address: addressP,
|
isDefault: true,
|
realName: res.userName,
|
postCode: res.postalCode,
|
phone: res.telNumber,
|
detail: res.detailInfo,
|
id: 0
|
//type: 1//区别城市id（导入微信地址无城市id需要后台自己查找）;
|
}).then(res => {
|
that.$util.Tips({
|
title: "添加成功",
|
icon: 'success'
|
}, function() {
|
that.getAddressList(true);
|
});
|
}).catch(err => {
|
return that.$util.Tips({
|
title: (err && err.message) ? err.message : err
|
});
|
});
|
},
|
fail: function(res) {
|
if (res.errMsg == 'chooseAddress:cancel') return that.$util
|
.Tips({
|
title: '取消选择'
|
});
|
},
|
})
|
},
|
fail: function(res) {
|
uni.showModal({
|
title: '您已拒绝导入微信地址权限',
|
content: '是否进入权限管理，调整授权？',
|
success(res) {
|
if (res.confirm) {
|
uni.openSetting({
|
success: function(res) {
|
console.log(res.authSetting)
|
}
|
});
|
} else if (res.cancel) {
|
return that.$util.Tips({
|
title: '已取消！'
|
});
|
}
|
}
|
})
|
}
|
})
|
},300)
|
},
|
/*
|
* 导入微信地址（公众号）
|
*/
|
getAddress() {
|
let that = this;
|
clearTimeout(that.loadingWechartAddress)
|
that.loadingWechartAddress=setTimeout(() => {
|
that.$wechat.openAddress().then(userInfo => {
|
// open();
|
editAddress({
|
realName: userInfo.userName,
|
phone: userInfo.telNumber,
|
address: {
|
province: userInfo.provinceName,
|
city: userInfo.cityName,
|
district: userInfo.countryName,
|
cityId: 0
|
},
|
detail: userInfo.detailInfo,
|
postCode: userInfo.postalCode,
|
isDefault: true
|
})
|
.then(() => {
|
that.loadingWechartAddress = null
|
that.$util.Tips({
|
title: "添加成功",
|
icon: 'success'
|
}, function() {
|
// close();
|
that.getAddressList(true);
|
});
|
})
|
.catch(err => {
|
that.loadingWechartAddress = null
|
// close();
|
return that.$util.Tips({
|
title: ((err && err.message) ? err.message : err) || "添加失败"
|
});
|
});
|
});
|
}, 300)
|
},
|
/**
|
* 获取地址列表
|
*
|
*/
|
getAddressList: function(isPage) {
|
let that = this;
|
if (isPage) {
|
that.loadend = false;
|
that.page = 1;
|
that.$set(that, 'addressList', []);
|
};
|
if (that.loading) return;
|
if (that.loadend) return;
|
that.loading = true;
|
that.loadTitle = '';
|
getAddressList({
|
page: that.page,
|
limit: that.limit
|
}).then(res => {
|
let list = res.data.list;
|
let loadend = list.length < that.limit;
|
that.addressList = that.$util.SplitArray(list, that.addressList);
|
that.$set(that, 'addressList', that.addressList);
|
that.loadend = loadend;
|
that.loadTitle = loadend ? '我也是有底线的' : '加载更多';
|
that.page = that.page + 1;
|
that.loading = false;
|
}).catch(err => {
|
that.loading = false;
|
that.loadTitle = '加载更多';
|
});
|
},
|
/**
|
* 设置默认地址
|
*/
|
radioChange: function(index) {
|
// let index = parseInt(e.detail.value),
|
let that = this;
|
let address = this.addressList[index];
|
if (address == undefined) return that.$util.Tips({
|
title: '您设置的默认地址不存在!'
|
});
|
setAddressDefault(address.id).then(res => {
|
for (let i = 0, len = that.addressList.length; i < len; i++) {
|
if (i == index) that.addressList[i].isDefault = true;
|
else that.addressList[i].isDefault = false;
|
}
|
that.$util.Tips({
|
title: '设置成功',
|
icon: 'success'
|
}, function() {
|
//that.$set(that, 'addressList', that.addressList);
|
|
});
|
that.getAddressList(true);
|
}).catch(err => {
|
return that.$util.Tips({
|
title: (err && err.message) ? err.message : err
|
});
|
});
|
},
|
/**
|
* 编辑地址
|
*/
|
editAddress: function(id) {
|
let cartId = this.cartId,
|
pinkId = this.pinkId,
|
couponId = this.couponId;
|
this.cartId = '';
|
this.pinkId = '';
|
this.couponId = '';
|
let url='/pages/users/user_address/index?id=' + id
|
if(cartId || cartId==0){
|
url+='&cartId='+cartId
|
}
|
if(pinkId || pinkId==0){
|
url+='&pinkId='+pinkId
|
}
|
if(couponId || couponId==0){
|
url+='&couponId='+couponId
|
}
|
if(this.secKill || this.secKill==0){
|
url+='&secKill='+this.secKill
|
}
|
if(this.combination || this.combination==0){
|
url+='&combination='+this.combination
|
}
|
if(this.bargain || this.bargain==0){
|
url+='&bargain='+this.bargain
|
}
|
uni.navigateTo({
|
url
|
})
|
},
|
/**
|
* 删除地址
|
*/
|
delAddress: function(index) {
|
let that = this,
|
address = this.addressList[index];
|
if (address == undefined) return that.$util.Tips({
|
title: '您删除的地址不存在!'
|
});
|
delAddress(address.id).then(res => {
|
that.$util.Tips({
|
title: '删除成功',
|
icon: 'success'
|
}, function() {
|
that.addressList.splice(index, 1);
|
that.$set(that, 'addressList', that.addressList);
|
});
|
}).catch(err => {
|
return that.$util.Tips({
|
title: (err && err.message) ? err.message : err
|
});
|
});
|
},
|
/**
|
* 新增地址
|
*/
|
addAddress: function() {
|
let cartId = this.cartId,
|
pinkId = this.pinkId,
|
couponId = this.couponId;
|
this.cartId = '';
|
this.pinkId = '';
|
this.couponId = '';
|
uni.navigateTo({
|
url: '/pages/users/user_address/index?preOrderNo=' + this.preOrderNo
|
})
|
},
|
goOrder: function(item) {
|
let that=this;
|
console.log(item,that.preOrderNo,that.orderId);
|
if (that.preOrderNo) {
|
uni.redirectTo({
|
url: '/pages/users/order_confirm/index?is_address=1&preOrderNo=' + that.preOrderNo +
|
'&addressId=' + item.id
|
})
|
}else if(that.orderId){
|
console.log(that.orderId);
|
updateAddress({
|
"id": that.dataId,
|
"realName":item.realName,
|
"userAddress":item.province+item.city+item.district+item.detail,
|
"userPhone":item.phone
|
}).then(()=>{
|
uni.redirectTo({
|
url: '/pages/order_details/index?order_id=' + that.orderId
|
})
|
})
|
|
}
|
}
|
},
|
onReachBottom: function() {
|
this.getAddressList();
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.orderTips{
|
width: 690rpx;
|
margin:0 auto;
|
font-size:28rpx;
|
padding:30rpx 0 20rpx 0;
|
|
}
|
.address-management {
|
padding: 20rpx 30rpx;
|
background-color: #F5F5F5;
|
height: 1300rpx;
|
|
.radio-group {
|
// background-color: #FFFFFF;
|
}
|
|
.item {
|
background-color: #fff;
|
padding: 0 30rpx 34rpx 30rpx;
|
margin-bottom: 20rpx;
|
border-radius: 8pt;
|
|
.address {
|
padding: 35rpx 0;
|
// border-bottom: 1rpx solid #eee;
|
font-size: 28rpx;
|
color: #282828;
|
font-weight: bold;
|
|
.consignee {
|
font-size: 42rpx;
|
margin-bottom: 8rpx;
|
|
.phone {
|
margin-left: 25rpx;
|
font-size: 28rpx;
|
}
|
}
|
}
|
|
.operation {
|
height: 83rpx;
|
font-size: 28rpx;
|
color: #282828;
|
|
.radio text {
|
// margin-left: 13rpx;
|
font-size: 24rpx;
|
font-weight: bold;
|
color: #979797;
|
}
|
|
.is-default text {
|
color: #000;
|
}
|
|
.btn {
|
width: 160rpx;
|
height: 72rpx;
|
border-radius: 3pt;
|
line-height: 72rpx;
|
text-align: center;
|
}
|
|
.btn-shanchu {
|
background-color: #F5F5F5;
|
}
|
|
.btn-bianji {
|
background-color: rgba(1, 109, 204, 0.1);
|
color: #016DCC;
|
margin-left: 13rpx;
|
}
|
|
.iconfont {
|
color: #2c2c2c;
|
font-size: 35rpx;
|
vertical-align: -2rpx;
|
margin-right: 10rpx;
|
|
&.icon-shanchu {
|
margin-left: 35rpx;
|
font-size: 38rpx;
|
}
|
}
|
}
|
}
|
}
|
|
.line {
|
width: 100%;
|
height: 3rpx;
|
|
image {
|
width: 100%;
|
height: 100%;
|
display: block;
|
}
|
}
|
|
.footer {
|
position: fixed;
|
width: 100%;
|
background-color: #F5F5F5;
|
bottom: 30rpx;
|
height: 106rpx;
|
padding: 0 30rpx;
|
box-sizing: border-box;
|
}
|
|
.footer .addressBnt {
|
width: 330rpx;
|
height: 76rpx;
|
border-radius: 16rpx;
|
text-align: center;
|
line-height: 76rpx;
|
font-size: 30rpx;
|
color: #fff;
|
}
|
|
.footer .addressBnt.on {
|
width: 690rpx;
|
margin: 0 auto;
|
}
|
|
.footer .addressBnt .iconfont {
|
font-size: 35rpx;
|
margin-right: 8rpx;
|
vertical-align: -1rpx;
|
}
|
|
.footer .addressBnt.wxbnt {
|
background-color: #04C763;
|
}
|
|
.footer .addressBnt.xzbnt {
|
background-color: #016DCC;
|
}
|
|
.status_1 {
|
display: flex;
|
width: 750rpx;
|
// background-color: #E93323;
|
height: var(--status-bar-height);
|
}
|
</style>
|
