You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
339 lines
7.2 KiB
339 lines
7.2 KiB
<template>
|
|
<view class="page">
|
|
<view class="topcon">
|
|
<view class="tleft">收件地址</view>
|
|
<view class="tright" @click="gotoadd">
|
|
<uni-icons type="plusempty" size="14" color="#FFF"></uni-icons>新增地址
|
|
</view>
|
|
</view>
|
|
<view class="skcon" v-if="myaddresslist.length==0">
|
|
<image class="skimg" src="@/static/image/noaddress.png" mode="aspectFill" ></image>
|
|
</view>
|
|
<view class="scroll" v-else>
|
|
<view class="scell">
|
|
<view v-for="(item, index) in myaddresslist" :key="index" class="sitem">
|
|
<view class="lcon">
|
|
<view class="sname">
|
|
<text>{{item.name}}</text>
|
|
<text style="margin-left: 10rpx;margin-right: 10rpx;">{{item.phone}}</text>
|
|
<view v-if="item.isDefault" class="tip">默认</view>
|
|
</view>
|
|
<view class="sinfo">
|
|
{{item.province+item.city+item.district+item.address}}
|
|
</view>
|
|
</view>
|
|
<view class="opecon">
|
|
<uni-icons type="compose" size="25" color="#999999" @click="gotoedit(item,index)"></uni-icons>
|
|
<uni-icons type="trash-filled" size="25" color="#999999" @click="delDo(item.id)"></uni-icons>
|
|
</view>
|
|
</view>
|
|
<uni-load-more v-if="loadStatus!=='noMore'" iconType="circle" :status="loadStatus" />
|
|
</view>
|
|
</view>
|
|
|
|
<view class="submitcon">
|
|
<button type="primary" class="btn" @click="gotoadd">添加地址</button>
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { myCache } from '../../utils/utils.js';
|
|
export default {
|
|
data() {
|
|
return {
|
|
openId:"",
|
|
phone:"",
|
|
userid:"",
|
|
loadStatus:'more',
|
|
myaddresslist:[
|
|
// {
|
|
// id:1,
|
|
// contact:"张三",
|
|
// phone:"18900000001",
|
|
// address:"地址去地址去地址去地址去地址去地址去地址去地址去地址去地址去地址去",
|
|
// sortid:1
|
|
// }
|
|
]
|
|
};
|
|
},
|
|
onLoad() {
|
|
},
|
|
onReady(){
|
|
},
|
|
onShow(){
|
|
this.openId = myCache('openId');
|
|
var user = myCache('user');
|
|
this.userid = user.userid? user.userid:'';
|
|
this.phone = user.userphone;
|
|
if(this.userid==""||this.userid=="0"){
|
|
uni.navigateTo({
|
|
url: `/pages/login/login`
|
|
});
|
|
}
|
|
try{
|
|
this.getList();
|
|
}
|
|
catch(e){
|
|
this.myaddresslist=[];
|
|
console.log(e);
|
|
}
|
|
},
|
|
methods: {
|
|
async delDo(id){
|
|
var _this=this;
|
|
try{
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '确定要删除此收件地址吗？',
|
|
cancelText: '取消',
|
|
confirmText: '确定',
|
|
success: ress => {
|
|
if (ress.confirm) {
|
|
_this.delDoDo(id);
|
|
}
|
|
}
|
|
});
|
|
|
|
}
|
|
catch{
|
|
uni.showToast({
|
|
title: '收件地址删除失败！',
|
|
icon: 'error',
|
|
duration: 2000
|
|
});
|
|
}
|
|
},
|
|
async delDoDo(id) {
|
|
uni.showLoading({
|
|
title: '数据删除中...'
|
|
});
|
|
const {data: res} = await uni.$http.post('/api/address/del', {id:id});
|
|
if(res&&res.success){
|
|
uni.showToast({
|
|
title: '收件地址已删除！',
|
|
icon: 'success',
|
|
duration: 2000
|
|
});
|
|
this.myaddresslist=[];
|
|
this.loadStatus="more";
|
|
this.getList();
|
|
}
|
|
else{
|
|
uni.showToast({
|
|
title: '收件地址删除失败！请重试',
|
|
icon: 'error',
|
|
duration: 2000
|
|
})
|
|
}
|
|
},
|
|
gotoedit(item,index){
|
|
var type='edit';
|
|
var data=encodeURIComponent(JSON.stringify(item));
|
|
uni.navigateTo({
|
|
url: `/pages/address/add?data=${data}&index=${index}&type=${type}`
|
|
});
|
|
},
|
|
getAddr(){
|
|
var _this=this;
|
|
//
|
|
// #ifdef MP-ALIPAY
|
|
my.getAddress({
|
|
success: function(res) {
|
|
console.log(res);
|
|
if(res.result){
|
|
res.result.sortid=0;
|
|
// 保存地址
|
|
if(_this.myaddresslist&&_this.myaddresslist.length>0){
|
|
var ifexist=false
|
|
_this.myaddresslist.forEach((cell)=>{
|
|
if(cell.address==res.result.address){
|
|
ifexist=true
|
|
}
|
|
});
|
|
if(!ifexist){
|
|
// 如果不在列表中，就保存到列表中
|
|
_this.myaddresslist.push(res.result);
|
|
_this.$forceUpdate();
|
|
myCache("myaddresslist",_this.myaddresslist);
|
|
}
|
|
}
|
|
else{
|
|
_this.myaddresslist=[];
|
|
_this.myaddresslist.push(res.result);
|
|
_this.$forceUpdate();
|
|
myCache("myaddresslist",_this.myaddresslist);
|
|
}
|
|
}
|
|
},
|
|
fail: function(err) {
|
|
console.log(err);
|
|
}
|
|
});
|
|
// #endif
|
|
},
|
|
gotoadd(){
|
|
var type='add';
|
|
uni.navigateTo({
|
|
url: `/pages/address/add?type=${type}`
|
|
});
|
|
},
|
|
async getList() {
|
|
const {data: res} = await uni.$http.post('/api/address/list');
|
|
if(res.data&&res.data.length>0){
|
|
this.myaddresslist=res.data;
|
|
this.loadStatus="noMore";
|
|
}
|
|
else{
|
|
this.myaddresslist=[];
|
|
this.loadStatus="noMore";
|
|
}
|
|
this.$forceUpdate();
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.page{
|
|
padding: 0;
|
|
position: relative;
|
|
display: block;
|
|
background-color: #F5F5F5;
|
|
}
|
|
|
|
.topcon{
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding: 30rpx;
|
|
.tleft{
|
|
font-weight: 400;
|
|
font-size: 28rpx;
|
|
color: #23262F;
|
|
}
|
|
.tright{
|
|
width: 160rpx;
|
|
height: 50rpx;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #FFFFFF;
|
|
background: #00a89b;
|
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
}
|
|
.skcon{
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 100%;
|
|
.skimg{
|
|
width: 360rpx;
|
|
height: 320rpx;
|
|
margin-top: 200rpx;
|
|
}
|
|
.sktip{
|
|
margin-top: 42rpx;
|
|
margin-left: 30rpx;
|
|
margin-right: 30rpx;
|
|
margin-bottom: 30rpx;
|
|
height: 48rpx;
|
|
line-height: 48rpx;
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #23262F;
|
|
}
|
|
}
|
|
.submitcon{
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 168rpx;
|
|
background-color: #FFFFFF;
|
|
}
|
|
.btn{
|
|
margin: 20rpx auto 54rpx;
|
|
font-size: 32rpx;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #FCFCFD;
|
|
width: 560rpx;
|
|
height: 76rpx;
|
|
line-height: 76rpx;
|
|
background: #00a89b;
|
|
box-shadow: 0rpx 12rpx 64rpx 2rpx rgba(137,150,95,0.4);
|
|
border-radius: 10rpx;
|
|
opacity: 1;
|
|
&::after{
|
|
border:none;
|
|
}
|
|
}
|
|
.scroll{
|
|
width: 100%;
|
|
position: relative;
|
|
display: block;
|
|
margin-bottom: 178rpx;
|
|
margin-top: 20rpx;
|
|
}
|
|
.scell{
|
|
display: flex;
|
|
background-color: #F5F5F5;
|
|
padding: 0 24rpx 0 24rpx;
|
|
flex-direction: column;
|
|
.sitem {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
background-color: #FFFFFF;
|
|
margin-bottom: 20rpx;
|
|
border-radius: 16rpx;
|
|
.lcon{
|
|
display: flex;
|
|
flex: 1;
|
|
flex-direction: column;
|
|
}
|
|
.opecon{
|
|
width: 110rpx;
|
|
display: flex;
|
|
}
|
|
.sname{
|
|
font-size: 30rpx;
|
|
font-weight: 600;
|
|
color: rgb(29, 29, 29);
|
|
padding: 24rpx;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
display: flex;
|
|
.tip{
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #FFFFFF;
|
|
width: 80rpx;
|
|
height: 48rpx;
|
|
text-align: center;
|
|
line-height: 50rpx;
|
|
background: #00a89b;
|
|
border-radius: 24rpx;
|
|
margin-left: 10rpx;
|
|
}
|
|
}
|
|
.sinfo{
|
|
padding: 0 24rpx 24rpx;
|
|
font-size: 26rpx;
|
|
color:rgb(116, 116, 116);
|
|
line-height: 40rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
</style>
|