92 lines
2.1 KiB
Vue
92 lines
2.1 KiB
Vue
<template>
|
||
<view class="mine_address_warp">
|
||
<view
|
||
v-for="item in addressList"
|
||
:key="item.id"
|
||
:class="selectAddress && selectAddress.id === item.id?'address_item address_item_sel':'address_item'"
|
||
v-if="addressList && addressList.length !==0"
|
||
@click="checkAddress(item)"
|
||
>
|
||
<view class="address_item_country_name">
|
||
{{item.countryName}} {{item.provinceName}} {{item.cityName}} {{item.areaName}}
|
||
</view>
|
||
<view class="address_item_address">
|
||
{{item.address}}
|
||
</view>
|
||
<view class="address_item_info">
|
||
<view>{{item.name}}</view>
|
||
<view style="margin-left: 20rpx;">{{item.phone}}</view>
|
||
</view>
|
||
</view>
|
||
<view v-else class="not_order_warp">
|
||
<view class="not_order_warp_img"><up-image src="/static/common/not_search.png" width="100" height="100" bgColor="#f1f6ff00"></up-image></view>
|
||
<view class="not_order_msg_warp">暂时地址，快去地址管理添加吧~</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { getAddress,setAddressDefault,deleteAddress } from '@/api/address.js';
|
||
|
||
export default {
|
||
data() {
|
||
return {
|
||
addressList:[],
|
||
selectAddress:{},
|
||
}
|
||
},
|
||
mounted() {
|
||
this.getAddressList();
|
||
},
|
||
methods: {
|
||
// 添加地址
|
||
jumpAddAddress(){
|
||
uni.navigateTo({
|
||
url:'/pages/mine_address_add/mine_address_add',
|
||
})
|
||
},
|
||
// 查询地址
|
||
async getAddressList(){
|
||
const res = await getAddress();
|
||
if(res && res.bizcode === 100){
|
||
this.addressList = res.data;
|
||
}
|
||
},
|
||
checkAddress(item){
|
||
this.selectAddress = item;
|
||
this.$emit("valueFunc", item);
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
|
||
.mine_address_warp{
|
||
}
|
||
.address_item{
|
||
background: #FFFFFF;
|
||
padding: 30rpx;
|
||
border-bottom: 1rpx solid #9e9e9e26;
|
||
}
|
||
.address_item_sel{
|
||
color: $app-bt-bj !important;
|
||
background-color: #ff57220d;
|
||
}
|
||
.address_item_info{
|
||
font-size: 26rpx;
|
||
color: #868383;
|
||
display: flex;
|
||
}
|
||
.address_item_address{
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #666666;
|
||
margin: 10rpx 0;
|
||
}
|
||
.address_item_country_name{
|
||
color: #9E9E9E;
|
||
font-size: 22rpx;
|
||
}
|
||
</style>
|