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.
139 lines
2.8 KiB
139 lines
2.8 KiB
<template>
|
|
<view class="card">
|
|
<view class="top" @click="$emit('click')">
|
|
<addressView :data="data"></addressView>
|
|
</view>
|
|
<view class="flex bottom">
|
|
<view class="flex col">
|
|
<view>
|
|
<uv-radio-group
|
|
v-model="radiovalue"
|
|
shape="circle"
|
|
size="36rpx"
|
|
iconSize="36rpx"
|
|
labelSize="24rpx"
|
|
labelColor="#9B9B9B"
|
|
activeColor="#7451DE"
|
|
@change="onRadioChange"
|
|
>
|
|
<uv-radio :name="1">
|
|
<view>默认地址</view>
|
|
</uv-radio>
|
|
</uv-radio-group>
|
|
</view>
|
|
</view>
|
|
<button class="flex col btn" @click="onEdit">
|
|
<image class="icon" src="@/pages_order/static/address/icon-edit.png" mode="scaleToFill"></image>
|
|
<view>编辑</view>
|
|
</button>
|
|
<button class="flex col btn" @click="onDelete">
|
|
<image class="icon" src="@/pages_order/static/address/icon-delete.png" mode="scaleToFill"></image>
|
|
<view>删除</view>
|
|
</button>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import addressView from './addressView.vue';
|
|
|
|
export default {
|
|
components: {
|
|
addressView,
|
|
},
|
|
props: {
|
|
data: {
|
|
type: Object,
|
|
default() {
|
|
return {}
|
|
}
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
radiovalue: null,
|
|
}
|
|
},
|
|
computed: {
|
|
isDefault: {
|
|
set(val) {
|
|
this.radiovalue = val ? 1 : null
|
|
|
|
if (this.data.default == val) {
|
|
return
|
|
}
|
|
|
|
// todo: set this address as default
|
|
|
|
this.$emit('defaultChange', val)
|
|
},
|
|
get() {
|
|
return this.radiovalue == 1 ? true : false
|
|
}
|
|
},
|
|
},
|
|
watch: {
|
|
data: {
|
|
handler(val) {
|
|
this.isDefault = val.default
|
|
},
|
|
immediate: true,
|
|
deep: true,
|
|
}
|
|
},
|
|
methods: {
|
|
onRadioChange() {
|
|
this.isDefault = true
|
|
},
|
|
onEdit() {
|
|
// todo
|
|
this.$emit('edit')
|
|
},
|
|
onDelete() {
|
|
uni.showModal({
|
|
title: '确认删除？',
|
|
success : e => {
|
|
if(e.confirm){
|
|
// todo
|
|
this.$emit('delete')
|
|
}
|
|
}
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.card {
|
|
padding: 24rpx 32rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 24rpx;
|
|
|
|
.top {
|
|
padding-bottom: 24rpx;
|
|
}
|
|
|
|
.bottom {
|
|
padding-top: 24rpx;
|
|
column-gap: 24rpx;
|
|
border-top: 2rpx dashed #DADADA;
|
|
|
|
.col {
|
|
flex: 1;
|
|
column-gap: 8rpx;
|
|
|
|
font-family: PingFang SC;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
line-height: 1.4;
|
|
color: #9B9B9B;
|
|
|
|
.icon {
|
|
width: 36rpx;
|
|
height: 36rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|