140 lines
3.1 KiB
Vue
140 lines
3.1 KiB
Vue
<template>
|
|
|
|
<view class="flex-col pos">
|
|
|
|
<view class="flex-row items-center section_2" v-if="isShow">
|
|
<image
|
|
class="shrink-0 image"
|
|
:src="shoppingCartUrl + '/component/dw.png'"
|
|
/>
|
|
<view class="flex-col flex-1 group">
|
|
<view class="flex-row items-baseline group_14">
|
|
<text class="font text" style="margin-right: 15rpx;">{{ addressInfo.name }}</text>
|
|
<text class="text_2">{{ addressInfo.phone }}</text>
|
|
</view>
|
|
<text class="font_2 text_3 mt-9">{{ addressInfo.region }} {{ addressInfo.detailAddress }}</text>
|
|
</view>
|
|
<image
|
|
class="shrink-0 image_2 image_3"
|
|
:src="shoppingCartUrl + '/component/yjt.png'"
|
|
/>
|
|
</view>
|
|
|
|
|
|
<view class="flex-row justify-between items-center section_3 mt-9" v-if="!isShow">
|
|
<view class="flex-row items-center">
|
|
<image
|
|
class="shrink-0 image"
|
|
:src="shoppingCartUrl + '/component/dw.png'"
|
|
/>
|
|
<text class="font text_4 ml-11">请选择收货地址</text>
|
|
</view>
|
|
<image
|
|
class="image_2"
|
|
:src="shoppingCartUrl + '/component/yjt.png'"
|
|
/>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {onMounted, onUnmounted, ref} from 'vue'
|
|
import emitter from '../../../utils/emitter';
|
|
import { JudgeIsNullity } from '../../../common/globalFunction';
|
|
import { shoppingCartUrl } from '../../../common/globalImagesUrl';
|
|
const isShow = ref(false)
|
|
const addressInfo = ref({})
|
|
|
|
const getAddressInfoHandler = (val) => {
|
|
addressInfo.value = val
|
|
isShow.value = !JudgeIsNullity(addressInfo.value.name)
|
|
}
|
|
|
|
|
|
const delAddressByIdHandler = (val) => {
|
|
if (addressInfo.value.id === val) {
|
|
isShow.value = false
|
|
}
|
|
}
|
|
|
|
|
|
onMounted(() => {
|
|
emitter.on('getAddressInfo', getAddressInfoHandler)
|
|
|
|
emitter.on('delAddressById', delAddressByIdHandler)
|
|
})
|
|
|
|
onUnmounted(() => {
|
|
|
|
emitter.off('getAddressInfo', getAddressInfoHandler)
|
|
|
|
emitter.off('delAddressById', delAddressByIdHandler)
|
|
})
|
|
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.mt-9 {
|
|
margin-top: 5.88rpx;
|
|
}
|
|
.ml-11 {
|
|
margin-left: 20.63rpx;
|
|
}
|
|
.section_2 {
|
|
padding: 29.42rpx 20.63rpx 23.08rpx;
|
|
background-color: #ffffff;
|
|
border-radius: 18.75rpx;
|
|
}
|
|
.image {
|
|
width: 43.13rpx;
|
|
height: 43.13rpx;
|
|
}
|
|
.group {
|
|
margin-left: 21.45rpx;
|
|
}
|
|
.group_14 {
|
|
padding: 0 3.17rpx;
|
|
}
|
|
.font {
|
|
font-size: 30rpx;
|
|
font-family: FZSongKeBenXiuKaiS-R-GB;
|
|
line-height: 25.54rpx;
|
|
}
|
|
.text {
|
|
color: #323232;
|
|
line-height: 25.89rpx;
|
|
}
|
|
.text_2 {
|
|
color: #323232;
|
|
font-size: 30rpx;
|
|
font-family: FZSongKeBenXiuKaiS-R-GB;
|
|
line-height: 20.04rpx;
|
|
}
|
|
.font_2 {
|
|
font-size: 26.25rpx;
|
|
font-family: FZSongKeBenXiuKaiS-R-GB;
|
|
line-height: 25.54rpx;
|
|
color: #323232;
|
|
}
|
|
.text_3 {
|
|
color: #818181;
|
|
line-height: 31.88rpx;
|
|
}
|
|
.image_2 {
|
|
width: 24.38rpx;
|
|
height: 24.38rpx;
|
|
}
|
|
.image_3 {
|
|
margin-left: 38.55rpx;
|
|
}
|
|
.section_3 {
|
|
padding: 31.88rpx 20.63rpx 30rpx;
|
|
background-color: #ffffff;
|
|
border-radius: 18.75rpx;
|
|
}
|
|
.text_4 {
|
|
color: #818181;
|
|
line-height: 29.06rpx;
|
|
}
|
|
@import url(../../../common/css/global.css);
|
|
</style> |