95 lines
2.2 KiB
Vue
95 lines
2.2 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();
|
||
},
|
||
activated () {
|
||
this.getAddressList();
|
||
},
|
||
methods: {
|
||
// 添加地址
|
||
jumpAddAddress() {
|
||
uni.navigateTo({
|
||
url: '/pages/mine_package/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>
|