<template>
|
<!-- 改动的默认地址通过全局变量来控制吧 -->
|
<view class="flex location-select" @click="goToAddress">
|
<uni-icons type="location" size="24" style="padding-top: 16rpx;margin-right: 8rpx;"></uni-icons>
|
<view class="info">
|
<view class="name" v-if="!address.id">请前往设置地址信息</span>
|
</view>
|
<view class="name">{{ address.name || '-' }}<span class="tel">{{ address.tel || '-' }}</span>
|
</view>
|
<view class="address">
|
{{ address['province'] || '' }}{{ address['city'] && ('/' + address['city']) || '' }}{{
|
address['region'] && ('/' + address['region']) || ''
|
}}
|
{{ address.address || '' }}
|
</view>
|
</view>
|
<view class="right-icon" style="padding-top: 16rpx;">
|
<uni-icons type="right" size="18" color="#B3B3B3"></uni-icons>
|
</view>
|
|
|
</view>
|
</template>
|
|
<script>
|
import {
|
mapState
|
} from 'vuex'
|
|
export default {
|
computed: {
|
...mapState({
|
address: state => {
|
return state.defaultaddress || {}
|
},
|
currentInfo: state => {
|
return state.currentInfo || {}
|
},
|
}),
|
},
|
name: "common-address-select",
|
data() {
|
return {};
|
},
|
async mounted() {
|
await this.init()
|
},
|
methods: {
|
async init() {
|
//获取默认地址并且填充
|
if (!this.address.id && this.currentInfo.id) {
|
this.$message.showLoading()
|
const {
|
data
|
} = await this.$http.request('get', '/api/address/default/detail')
|
this.$message.hideLoading()
|
if (data) {
|
//提交更新默认地址
|
this.$store.commit('setDefaultAddress', {
|
...data
|
})
|
}
|
}
|
|
},
|
goToAddress() {
|
if (!this.currentInfo.id) {
|
this.$message.showToast('请先前往登录')
|
return
|
}
|
uni.navigateTo({
|
url: '/pages/user/address/address?source=select'
|
})
|
}
|
},
|
props: {
|
// address:{
|
// type:Object,
|
// default(){
|
// return {}
|
// }
|
// }
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.location-select {
|
.info {
|
|
// margin-bottom: 16rpx;
|
.name {
|
font-weight: 400;
|
font-size: 32rpx;
|
color: #000000;
|
margin-left: 6rpx;
|
|
.tel {
|
margin-left: 6rpx;
|
font-size: 28rpx;
|
color: #666666;
|
}
|
}
|
|
.address {
|
font-size: 24rpx;
|
color: #666666;
|
line-height: 28rpx;
|
margin-top: 6rpx;
|
max-width: 580rpx;
|
margin-left: 6rpx;
|
word-wrap: break-word;
|
}
|
|
}
|
|
.right-icon {
|
margin-left: auto;
|
margin-right: 0rpx;
|
}
|
}
|
</style>
|
