<view class="no-content" wx:if="{{areaList.length==0}}">
<view class="imgbox">
<image style="width:200rpx;" src="/images/none.png" mode="widthFix" />
</view>
<view>暂无地址信息</view>
</view>
<view class="address-item" wx:for="{{areaList}}" wx:for-index="index" wx:for-item="item" wx:key="*this">
<view>
<text class="address-item-name">{{item.name}}</text>
<text class="address-item-phone">{{item.phone}}</text>
</view>
<view class="address-item-address">{{item.province}}{{item.city}}{{item.county}}{{item.detailInfo}}</view>
<view class="address-item-menu">
<view class="address-item-left">
<block wx:if="{{item.isDefault}}">
<text style="color:#1AAD16;">默认</text>
</block>
<block wx:else>
<button class="none-btn btn-default" data-id="{{item.id}}" bindtap="setAddressDefault">设为默认</button>
</block>
</view>
<view class="address-item-right">
<button class="none-btn btn-edit" data-id="{{item.id}}" bindtap="gotoAddressinfo">编辑</button>
<button class="none-btn btn-del">删除</button>
</view>
</view>
</view>
<view class="button-group">
<button style="background-color: red;" data-id="add" bindtap="gotoAddressinfo">
<my-icon type="jiahao" size="35"/> 新建地址</button>
<button bindtap="wxAddress">
<my-icon type="weixin" size="35"/> 微信添加</button>
</view>
//获取应用实例
const app = getApp()
Page({
/**
* 页面的初始数据
*/
data: {
areaList:[],
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
},
//通过微信添加地址
wxAddress: function () {
var that=this;
wx.chooseAddress({
success: function (res) {
var address = {
"name": res.userName,
"phone": res.telNumber,
"province": res.provinceName,
"city": res.cityName,
"county": res.countyName,
"detailInfo": res.detailInfo,
};
//获取到的地址存到data里的areaList中
that.setData({
areaList:that.data.areaList.push(address)
});
},
fail: () => {
this.openConfirm() // 如果获取地址权限失败，弹出确认弹窗，让用户选择是否要打开设置，手动去开权限
}
})
},
})
page {
background: #f5f5f5;
}
.no-content{
margin: 50% auto;
}
.button-group {
display: flex;
width: 100%;
height: 100rpx;
line-height: 100rpx;
position: fixed;
left: 0;
bottom: 0;
}
.button-group button {
display: inline-block;
width: 100%;
height: 100rpx;
line-height: 100rpx;
background-color: #1aad16;
color: #fff;
white-space: nowrap;
text-align: center;
font-size: 30rpx;
border: none;
outline: none;
border-style: none;
border-radius: 0;
cursor: pointer;
}
.button-group button::after {
border: none;
}
.address-item {
background: #fff;
padding: 30rpx;
color: #555;
margin-bottom: 20rpx;
}
.address-item view {
height: 50rpx;
line-height: 50rpx;
}
.address-item-name {
font-weight: bold;
padding-right: 10rpx;
}
.address-item-address {
color: #999;
}
.address-item-menu {
display: flex;
height: 60rpx;
line-height: 60rpx;
}
.address-item-menu button {
color: #333;
font-size: 25rpx;
padding: 0;
margin: 0;
}
.address-item-left {
flex: 1;
}
.address-item-left button {
float: left;
}
.address-item-right {
display: flex;
}
.address-item-right .btn-del {
color: red;
margin-left: 30rpx;
}
