jyy-smart-canteen-h5/pages/mine/me/myAddress.vue

152 lines
3.8 KiB
Vue

<template>
<page-meta :page-font-size="fontValue+'px'" :root-font-size="fontValue+'px'"></page-meta>
<view class="address-list">
<Navbar title="我的地址" :showRightText="true" :isBack="false" :text="'新增地址'" @clickIcon="addAddress"/>
<view v-if="addressList.length == 0" class="flex justify-center align-center" style="height: 50vh">
<u-empty icon="../../../static/images/not_order.png" text="暂无数据" textColor="#000" />
</view>
<view v-for="(item, index) in addressList" :key="index" class="address-item">
<view class="address-info">
<text class="address-text">{{ item.addrFullName }} {{item.detailAddr}}</text>
<view class="contact-info">
<view @click="changeDefault(item)" style="margin-right: 20rpx;font-size: 24rpx;border: 1px solid #ff8ba0;color: #ff8ba0;padding: 4rpx;border-radius: 8rpx;background: #fff2f8;">
{{item.ifDefault=="1"?"默认":"设为默认"}}
</view>
<text class="contact-text">{{ item.userName }}</text>
<text class="contact-text">{{ item.mobile }}</text>
</view>
</view>
<u-icon name="edit-pen-fill" color="#c8c9cc" size="22" @click="handleEdit(item)"></u-icon>
</view>
</view>
</template>
<script>
import { queryCustAddrApi,updateDefaultAddrApi } from '@/api/mine/address.js';
export default {
data() {
return {
fontValue:uni.getStorageSync('fontSize') || 8,
addressList: [
// {
// address: '府前西街与站前北街交叉口南200米',
// name: '冯先生1',id: '1',
// phone: '153****5876',
// ifDefault:"1"
// },
// {
// address: '怡馨家园30号楼(近达人街商城)',
// name: '冯先生',id: '2',ifDefault:"0",
// phone: '153****5876'
// },
// {
// address: '西辛南区46号楼2单元101室',
// name: '冯先生',id: '3',ifDefault:"0",
// phone: '153****5876'
// }
]
}
},
onLoad() {
},
onShow(){
this.queryCustAddrList()
},
methods: {
async queryCustAddrList() {
try {
let param = {}
const res = await queryCustAddrApi(param)
console.log('?? ~ getList ~ res:', res)
this.addressList = res.rows;
} catch (error) {
console.log(error)
}
},
changeDefault(item){
console.log(item)
if(item.ifDefault==2){
this.updateDefaultAddr(item)
}
},
async updateDefaultAddr(item) {
try {
let param = {
"addrId":item.addrId,
"userId":uni.getStorageSync('userId')
}
const res = await updateDefaultAddrApi(param)
if(res.code==200){
uni.$u.toast(`操作成功!`)
this.queryCustAddrList()
}else{
uni.$u.toast(`操作失败!`)
}
} catch (error) {
console.log(error)
}
},
handleEdit(address) {
// 处理编辑事件
// uni.$u.toast(`编辑第${index + 1}个地址`)
uni.navigateTo({
// url: `/pages/mine/me/upAddress?address=${encodeURIComponent(JSON.stringify(address))}`
url: `/pages/mine/me/upAddress?address=${JSON.stringify(address)}`
})
},
addAddress() {
uni.navigateTo({
url: `/pages/mine/me/upAddress`
})
},
}
}
</script>
<style lang="scss" scoped>
.address-list {
min-height: 100vh;
background-color: #f8f8f8;
padding: 30rpx;
}
.address-item {
background-color: #ffffff;
border-radius: 8rpx;
padding: 30rpx;
margin-bottom: 20rpx;
display: flex;
justify-content: space-between;
align-items: center;
}
.address-info {
flex: 1;
.address-text {
font-size: 26rpx;
color: #333333;
line-height: 1.5;
}
.contact-info {
margin-top: 10rpx;
display: flex;
align-items: center;
.contact-text {
font-size: 24rpx;
color: #999999;
&:first-child {
margin-right: 20rpx;
}
}
}
}
</style>