<template> <view class="flex-col page" :style="{ backgroundImage: 'url(' + bkgUrl + ')' }"> <view class="flex-col list"> <view class="flex-col list-item mt-10" v-for="(item, index) in addressArr" :key="index"> <view class="flex-row justify-between items-center"> <view class="flex-row items-center"> <text class="font">{{ item.name }}</text> <text class="font_2 text">{{ item.phone }}</text> <view class="flex-col justify-start items-center shrink-0 text-wrapper" v-if="item.isDefault === 1"> <text class="text_2">默认</text> </view> </view> <view class="flex-row"> <image class="image" :src="mineUrl + '/addressList/edit.png'" @click="editAddress(item)" /> <image class="image ml-12" :src="mineUrl + '/addressList/delete.png'" @click="confirmPop(item.id)" /> </view> </view> <view class="flex-col items-start mt-13"> <text class="font_3">{{ item.region }} {{ item.detailAddress }}</text> <!-- <text class="font_3">尔华德学院</text> --> </view> </view> </view> <view class="flex-col justify-start items-center section_2 mt-392" @click="jump_newAddress()"> <view class="flex-col justify-start items-center text-wrapper_2"><text class="font text_3">新增地址</text></view> </view> </view> </template> <script setup> import { ref, onMounted } from 'vue' import { baseUrl } from '../../../api/request'; import { onShow, onLoad } from '@dcloudio/uni-app'; import { getFonts } from '../../../common/globalFont'; import { mineUrl } from '../../../common/globalImagesUrl'; const addressArr = ref([]) //地址数组 const bkgUrl = ref(mineUrl + '/addressList/bkg.png') onLoad(() => { getFonts() }) onShow(()=>{ getAddress() }) const getAddress = async ()=> { //获取地址方法 const res = await uni.request({ url: baseUrl + '/address/list', method: 'POST', header: { cookie: wx.getStorageSync('cookie') } }) if( res.data.code === 1 ) { addressArr.value = res.data.data console.log('获取的地址信息--->',res.data.data); } } //编辑地址方法 const editAddress =(value)=>{ console.log('地址信息',value); uni.navigateTo({ url: '/pages/Shopping-cart/newaddress_Info/newaddress_Info?editInfo=' + JSON.stringify(value) }) } const confirmPop = (id) => { uni.showModal({ title: '提示', content: '是否删除地址?', success: (e) => { if(e.confirm) { deleteAddress(id) } else { return } } }) } //删除地址方法 const deleteAddress = async ( id ) =>{ const res = await uni.request({ url: baseUrl + '/address/delete', method: 'POST', header: { 'cookie': wx.getStorageSync('cookie') }, data: { id: id } }) // console.log(res.data); if( res.data.code === 1 ) { getAddress() // console.log("删除地址成功"); } } const jump_newAddress =()=> { uni.navigateTo({ url: '/pages/Shopping-cart/newaddress_Info/newaddress_Info' }) } </script> <style lang="scss" scoped> .mt-13 { margin-top: 24.38rpx; } .page { padding-top: 31.88rpx; background-size: 100% 100%; background-repeat: no-repeat; width: 100%; overflow-y: auto; overflow-x: hidden; height: 100vh; } .list { margin-left: 28.13rpx; margin-right: 26.27rpx; } .list-item { padding: 31.88rpx 18.75rpx 36.11rpx 24.62rpx; background-color: #ffffff; border-radius: 9.38rpx; } .list-item:first-child { margin-top: 0; } .font { font-size: 30rpx; font-family: FZSongKeBenXiuKaiS-R-GB; line-height: 25.89rpx; color: #323232; } .font_2 { font-size: 30rpx; font-family: FZSongKeBenXiuKaiS-R-GB; line-height: 20.04rpx; color: #323232; } .text { margin-left: 16.18rpx; } .text-wrapper { margin-left: 28.57rpx; padding: 5.1rpx 0 8.06rpx; background-color: #fbdedf; border-radius: 9.38rpx; width: 69.38rpx; height: 31.88rpx; } .text_2 { color: #c35c5d; font-size: 22.5rpx; font-family: FZSongKeBenXiuKaiS-R-GB; // line-height: 18.71rpx; } .image { border-radius: 9.38rpx; width: 39.38rpx; height: 39.38rpx; } .font_3 { font-size: 26.25rpx; font-family: FZSongKeBenXiuKaiS-R-GB; line-height: 31.88rpx; color: #818181; } .section_2 { position: fixed; left: 0; right: 0; bottom: 0; padding: 16.88rpx 0; background-color: #ffffff; } .text-wrapper_2 { padding: 25.43rpx 0 24.51rpx; background-color: #fbdedf; border-radius: 46.88rpx; width: 629.77rpx; } .text_3 { color: #c35c5d; line-height: 28.84rpx; } @import url(../../../common/css/global.css); </style>