|
@@ -2,27 +2,27 @@
|
|
|
<view class="address-page">
|
|
<view class="address-page">
|
|
|
<!-- 地址列表 -->
|
|
<!-- 地址列表 -->
|
|
|
<view class="address-list">
|
|
<view class="address-list">
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
<!-- 地址项组件 -->
|
|
<!-- 地址项组件 -->
|
|
|
- <address-item v-if="addressList.length > 0" v-for="(item, index) in addressList" :key="item.id" :address="item"
|
|
|
|
|
- :is-default="item.isDefault" @set-default="handleSetDefault(index)" @edit="handleEdit(index)"
|
|
|
|
|
- @delete="handleDelete(index)" />
|
|
|
|
|
-
|
|
|
|
|
- <!-- 空状态 -->
|
|
|
|
|
- <view class="empty-state" v-if="addressList.length === 0 && !loadState">
|
|
|
|
|
- <u-icon class="empty-icon" name="list" size="60" color="#ccc"></u-icon>
|
|
|
|
|
- <text class="empty-text">暂无数据</text>
|
|
|
|
|
- </view>
|
|
|
|
|
-
|
|
|
|
|
- <!-- 加载状态提示 -->
|
|
|
|
|
- <view class="load-more-status" v-if="loadState">
|
|
|
|
|
- <text>加载中...</text>
|
|
|
|
|
- </view>
|
|
|
|
|
-
|
|
|
|
|
- <view class="load-more-status" v-if="loadFinished && addressList.length !== 0">
|
|
|
|
|
- <text>没有更多数据了</text>
|
|
|
|
|
- </view>
|
|
|
|
|
|
|
+ <address-item v-if="addressList.length > 0" v-for="(item, index) in addressList" :key="item.id"
|
|
|
|
|
+ :address="item" :is-default="item.isDefault" @set-default="handleSetDefault(index)"
|
|
|
|
|
+ @edit="handleEdit(index)" @delete="handleDelete(index)" @click="onSelectAddress(item)" />
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 空状态 -->
|
|
|
|
|
+ <view class="empty-state" v-if="addressList.length === 0 && !loadState">
|
|
|
|
|
+ <u-icon class="empty-icon" name="list" size="60" color="#ccc"></u-icon>
|
|
|
|
|
+ <text class="empty-text">暂无数据</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 加载状态提示 -->
|
|
|
|
|
+ <view class="load-more-status" v-if="loadState">
|
|
|
|
|
+ <text>加载中...</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <view class="load-more-status" v-if="loadFinished && addressList.length !== 0">
|
|
|
|
|
+ <text>没有更多数据了</text>
|
|
|
|
|
+ </view>
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
<!-- 添加新地址按钮 -->
|
|
<!-- 添加新地址按钮 -->
|
|
@@ -39,11 +39,19 @@
|
|
|
import {
|
|
import {
|
|
|
ref
|
|
ref
|
|
|
} from 'vue'
|
|
} from 'vue'
|
|
|
- import { onShow,onPullDownRefresh,onReachBottom } from '@dcloudio/uni-app'
|
|
|
|
|
|
|
+ import {
|
|
|
|
|
+ onLoad,
|
|
|
|
|
+ onShow,
|
|
|
|
|
+ onPullDownRefresh,
|
|
|
|
|
+ onReachBottom
|
|
|
|
|
+ } from '@dcloudio/uni-app'
|
|
|
import AddressItem from '@/components/AddressItem.vue'
|
|
import AddressItem from '@/components/AddressItem.vue'
|
|
|
- import { listBook,delBook } from '../../api/address'
|
|
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
|
|
+ import {
|
|
|
|
|
+ listBook,
|
|
|
|
|
+ delBook
|
|
|
|
|
+ } from '../../api/address'
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
const pageNum = ref(1)
|
|
const pageNum = ref(1)
|
|
|
const pageSize = ref(10)
|
|
const pageSize = ref(10)
|
|
|
const recordTotal = ref(0)
|
|
const recordTotal = ref(0)
|
|
@@ -52,30 +60,47 @@
|
|
|
|
|
|
|
|
// 模拟地址数据
|
|
// 模拟地址数据
|
|
|
const addressList = ref([])
|
|
const addressList = ref([])
|
|
|
- const pages = ref(0)//数据总条数
|
|
|
|
|
|
|
+ const pages = ref(0) //数据总条数
|
|
|
|
|
|
|
|
// 当前要操作的地址索引
|
|
// 当前要操作的地址索引
|
|
|
const currentIndex = ref(-1)
|
|
const currentIndex = ref(-1)
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
|
|
+ const addType = ref('')
|
|
|
|
|
+
|
|
|
|
|
+ onLoad((option) => {
|
|
|
|
|
+ addType.value = option.addType
|
|
|
|
|
+ })
|
|
|
|
|
+
|
|
|
onShow(() => {
|
|
onShow(() => {
|
|
|
pageNum.value = 1
|
|
pageNum.value = 1
|
|
|
getAddressList()
|
|
getAddressList()
|
|
|
})
|
|
})
|
|
|
// 下拉刷新
|
|
// 下拉刷新
|
|
|
- onPullDownRefresh(()=>{
|
|
|
|
|
|
|
+ onPullDownRefresh(() => {
|
|
|
pageNum.value = 1
|
|
pageNum.value = 1
|
|
|
getAddressList()
|
|
getAddressList()
|
|
|
})
|
|
})
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
// 触底加载更多
|
|
// 触底加载更多
|
|
|
- onReachBottom(()=>{
|
|
|
|
|
|
|
+ onReachBottom(() => {
|
|
|
if (pageNum.value < pages.value) {
|
|
if (pageNum.value < pages.value) {
|
|
|
pageNum.value++;
|
|
pageNum.value++;
|
|
|
getAddressList()
|
|
getAddressList()
|
|
|
}
|
|
}
|
|
|
})
|
|
})
|
|
|
|
|
|
|
|
|
|
+ const onSelectAddress = (address) => {
|
|
|
|
|
+ console.log('-------address---',address)
|
|
|
|
|
+ if (!addType.value) {
|
|
|
|
|
+ return
|
|
|
|
|
+ }
|
|
|
|
|
+ uni.$emit('addressSelected', {
|
|
|
|
|
+ type:addType.value, // 'sender' 或 'receiver'
|
|
|
|
|
+ address // 选中的地址对象
|
|
|
|
|
+ })
|
|
|
|
|
+ uni.navigateBack() // 返回上一页
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
// 设置默认地址
|
|
// 设置默认地址
|
|
|
const handleSetDefault = (index) => {
|
|
const handleSetDefault = (index) => {
|
|
|
addressList.value.forEach((item, i) => {
|
|
addressList.value.forEach((item, i) => {
|
|
@@ -86,7 +111,9 @@
|
|
|
// 编辑地址
|
|
// 编辑地址
|
|
|
const handleEdit = (index) => {
|
|
const handleEdit = (index) => {
|
|
|
// 这里可以跳转到编辑页面
|
|
// 这里可以跳转到编辑页面
|
|
|
- uni.navigateTo({ url: '/pages/address/edit?id=' + addressList.value[index].addressId })
|
|
|
|
|
|
|
+ uni.navigateTo({
|
|
|
|
|
+ url: '/pages/address/edit?id=' + addressList.value[index].addressId
|
|
|
|
|
+ })
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
// 删除地址
|
|
// 删除地址
|
|
@@ -98,18 +125,18 @@
|
|
|
// showCancel:false,
|
|
// showCancel:false,
|
|
|
success: async (res) => {
|
|
success: async (res) => {
|
|
|
if (res.confirm) {
|
|
if (res.confirm) {
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
let res = await delBook(addressList.value[index].addressId)
|
|
let res = await delBook(addressList.value[index].addressId)
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
if (res.code == 200) {
|
|
if (res.code == 200) {
|
|
|
addressList.value.splice(currentIndex.value, 1)
|
|
addressList.value.splice(currentIndex.value, 1)
|
|
|
currentIndex.value = -1
|
|
currentIndex.value = -1
|
|
|
uni.showToast({
|
|
uni.showToast({
|
|
|
- title:'删除成功',
|
|
|
|
|
- icon:'success'
|
|
|
|
|
|
|
+ title: '删除成功',
|
|
|
|
|
+ icon: 'success'
|
|
|
})
|
|
})
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
} else if (res.cancel) {
|
|
} else if (res.cancel) {
|
|
|
console.log('用户点击取消');
|
|
console.log('用户点击取消');
|
|
|
}
|
|
}
|
|
@@ -123,40 +150,40 @@
|
|
|
url: '/pages/address/edit'
|
|
url: '/pages/address/edit'
|
|
|
})
|
|
})
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
const loadMore = () => {
|
|
const loadMore = () => {
|
|
|
pageNum.value++
|
|
pageNum.value++
|
|
|
getAddressList(true)
|
|
getAddressList(true)
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
// 获取地址列表
|
|
// 获取地址列表
|
|
|
const getAddressList = () => {
|
|
const getAddressList = () => {
|
|
|
const params = {
|
|
const params = {
|
|
|
pageNum: pageNum.value,
|
|
pageNum: pageNum.value,
|
|
|
pageSize: pageSize.value
|
|
pageSize: pageSize.value
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
- uni.showLoading({mask:true})
|
|
|
|
|
|
|
+
|
|
|
|
|
+ uni.showLoading({
|
|
|
|
|
+ mask: true
|
|
|
|
|
+ })
|
|
|
listBook(params).then(res => {
|
|
listBook(params).then(res => {
|
|
|
uni.hideLoading()
|
|
uni.hideLoading()
|
|
|
uni.stopPullDownRefresh()
|
|
uni.stopPullDownRefresh()
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
if (res.code === 200) {
|
|
if (res.code === 200) {
|
|
|
const list = res.rows || []
|
|
const list = res.rows || []
|
|
|
- addressList.value = pageNum.value == 1 ? list : [...addressList.value,...list]
|
|
|
|
|
|
|
+ addressList.value = pageNum.value == 1 ? list : [...addressList.value, ...list]
|
|
|
pages.value = Math.ceil(res.total / pageSize.value) || 0
|
|
pages.value = Math.ceil(res.total / pageSize.value) || 0
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
}
|
|
}
|
|
|
}, err => {
|
|
}, err => {
|
|
|
uni.hideLoading()
|
|
uni.hideLoading()
|
|
|
})
|
|
})
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<style scoped>
|
|
<style scoped>
|
|
@@ -168,19 +195,19 @@
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.address-list {
|
|
.address-list {
|
|
|
-
|
|
|
|
|
- padding: 20rpx 30rpx 152rpx ;
|
|
|
|
|
|
|
+
|
|
|
|
|
+ padding: 20rpx 30rpx 152rpx;
|
|
|
box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
.load-more-status {
|
|
.load-more-status {
|
|
|
text-align: center;
|
|
text-align: center;
|
|
|
padding: 20rpx;
|
|
padding: 20rpx;
|
|
|
font-size: 24rpx;
|
|
font-size: 24rpx;
|
|
|
color: #999;
|
|
color: #999;
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
.empty-state {
|
|
.empty-state {
|
|
|
display: flex;
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
flex-direction: column;
|
|
@@ -189,7 +216,7 @@
|
|
|
padding: 120rpx 40rpx;
|
|
padding: 120rpx 40rpx;
|
|
|
color: #999999;
|
|
color: #999999;
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
.empty-text {
|
|
.empty-text {
|
|
|
margin-top: 20rpx;
|
|
margin-top: 20rpx;
|
|
|
font-size: 28rpx;
|
|
font-size: 28rpx;
|