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.
192 lines
4.1 KiB
192 lines
4.1 KiB
<template>
|
|
<view class="address">
|
|
<u-navbar :title="$t('page.address.address')" @leftClick="leftClick"></u-navbar>
|
|
<view v-if="list.length > 0" class="address-list">
|
|
<u-radio-group v-model="radiovalue1" placement="column">
|
|
<view class="address-item" v-for="(item, index) in list">
|
|
<div class="radio">
|
|
<u-radio :name="item.id" :key="index" activeColor="#e68534"></u-radio>
|
|
</div>
|
|
<view class="address-info">
|
|
<view class="user-info">
|
|
<text>{{ item.name }}</text>
|
|
<text>{{ item.phone }}</text>
|
|
<u-tag v-if="item.defaultFlag == 'true'" text="默认" size="mini" type="warning"
|
|
shape="circle"></u-tag>
|
|
</view>
|
|
<view class="address-detail">
|
|
{{ item.region }}
|
|
{{ item.detail_address }}
|
|
</view>
|
|
</view>
|
|
<view class="icon">
|
|
<u-icon name="edit-pen" color="#ccc" size="28" @click="toAdd(item.id)"></u-icon>
|
|
<u-icon name="trash" color="#ccc" size="28" @click="del(item.id)"></u-icon>
|
|
</view>
|
|
</view>
|
|
</u-radio-group>
|
|
</view>
|
|
|
|
<view v-else class="no-product">
|
|
<view class="box">
|
|
<view class="no-product-title">{{ $t('page.address.no-address') }}</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="address-bottom">
|
|
<u-button @click="toAdd" type="primary" shape="circle" color="#ED7A2F"
|
|
:text="$t('page.address.addAddress')"></u-button>
|
|
</view>
|
|
|
|
<u-modal :show="delShow" @confirm="confirm" ref="uModal" :title="$t('myToactTitle')" @cancel="delCancel"
|
|
:showCancelButton="true" :confirmText="$t('page.address.confirm')" :cancelText="$t('page.address.cancel')"
|
|
:asyncClose="true">
|
|
<view class="slot-content">
|
|
<rich-text :nodes="$t('page.address.del_content')"></rich-text>
|
|
</view>
|
|
</u-modal>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
radiovalue1: '',
|
|
total: 0,
|
|
list: [],
|
|
delShow: false,
|
|
delId: ''
|
|
}
|
|
},
|
|
onShow() {
|
|
this.getAddressList();
|
|
},
|
|
methods: {
|
|
getAddressList() { //获取地址列表
|
|
this.request('addressPage', {}, {
|
|
"pageSize": 10,
|
|
"pageNo": 0
|
|
}).then(res => {
|
|
this.total = res.result.total
|
|
this.list = res.result.records;
|
|
})
|
|
},
|
|
toAdd(id) {
|
|
uni.navigateTo({
|
|
url: '/pages/user/address/addAddres?id=' + id
|
|
})
|
|
},
|
|
leftClick() {
|
|
uni.switchTab({
|
|
url: '/pages/user/user'
|
|
})
|
|
},
|
|
del(id) {
|
|
this.delShow = true;
|
|
this.delId = id
|
|
},
|
|
confirm() {
|
|
this.request('deleAddress', {
|
|
id: this.delId
|
|
}).then(res => {
|
|
this.delShow = false;
|
|
if (res.code == 200) {
|
|
this.getAddressList();
|
|
uni.$u.toast(this.$t('success-operation'))
|
|
}
|
|
})
|
|
},
|
|
delCancel() {
|
|
this.delShow = false;
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.address {
|
|
.address-list {
|
|
margin-top: 54px;
|
|
|
|
.address-item {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
background: white;
|
|
border-radius: 10rpx;
|
|
box-sizing: border-box;
|
|
padding: 15px 15px;
|
|
font-size: 25rpx;
|
|
border-bottom: 1px solid #eaeaea;
|
|
|
|
&:nth-last-child(1) {
|
|
border: none;
|
|
}
|
|
|
|
.radio {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.address-info {
|
|
width: calc(100% - 60px);
|
|
|
|
.user-info {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
text {
|
|
margin-right: 10rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.icon {
|
|
display: flex;
|
|
width: 70px;
|
|
justify-content: space-between;
|
|
}
|
|
}
|
|
}
|
|
|
|
.no-product {
|
|
height: calc(100vh - 124px);
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
box-sizing: border-box;
|
|
padding: 0px 15px;
|
|
|
|
.box {
|
|
font-size: 26rpx;
|
|
text-align: center;
|
|
|
|
.to-home {
|
|
padding: 20rpx 140rpx;
|
|
border: 1px solid #ccc;
|
|
border-radius: 5px;
|
|
text-align: center;
|
|
margin: 20rpx 0px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.address-bottom {
|
|
display: flex;
|
|
align-items: center;
|
|
position: fixed;
|
|
left: 0;
|
|
bottom: 0;
|
|
width: 100%;
|
|
height: 80px;
|
|
background: white;
|
|
box-shadow: -1px -1px 1px rgba(0, 0, 0, .1);
|
|
box-sizing: border-box;
|
|
padding: 0px 15px;
|
|
|
|
&::v-deep .u-button {
|
|
height: 70%;
|
|
}
|
|
}
|
|
}
|
|
</style>
|