|
@@ -13,8 +13,9 @@
|
|
|
// eslint-disable-next-line unused-imports/no-unused-imports
|
|
|
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
|
|
|
import useZPaging from 'z-paging/components/z-paging/js/hooks/useZPaging.js'
|
|
|
-import { addressList } from '@/api/mine'
|
|
|
+import { addressDel, addressList } from '@/api/mine'
|
|
|
import { toPage } from '@/utils/page'
|
|
|
+import { toast } from '@/utils/toast'
|
|
|
|
|
|
defineOptions({
|
|
|
name: 'AddressBook', // 地址簿
|
|
@@ -48,28 +49,79 @@ async function queryList(pageNo: number, pageSize: number) {
|
|
|
function editAddress(id: any) {
|
|
|
toPage('/pages/mine/addressBookOperate', { id })
|
|
|
}
|
|
|
+
|
|
|
+// 删除地址
|
|
|
+async function deleteAddress(id: any) {
|
|
|
+ try {
|
|
|
+ await uni.showLoading({
|
|
|
+ title: 'Deleting...',
|
|
|
+ })
|
|
|
+
|
|
|
+ const res = await addressDel({ id })
|
|
|
+
|
|
|
+ if (res.code === '200') {
|
|
|
+ toast.success('Address deleted successfully')
|
|
|
+ // 刷新列表
|
|
|
+ paging.value.reload()
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ toast.error(res.message || 'Delete failed, please try again')
|
|
|
+ }
|
|
|
+ }
|
|
|
+ catch (error: any) {
|
|
|
+ console.error('Delete address error:', error)
|
|
|
+ toast.error(error.message || 'Delete failed, please try again')
|
|
|
+ }
|
|
|
+ finally {
|
|
|
+ uni.hideLoading()
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// 处理滑动操作
|
|
|
+function handleAction(action: string, item: any) {
|
|
|
+ if (action === 'del') {
|
|
|
+ uni.showModal({
|
|
|
+ title: 'Confirm Delete',
|
|
|
+ content: 'Are you sure you want to delete this address?',
|
|
|
+ success: (res) => {
|
|
|
+ if (res.confirm) {
|
|
|
+ deleteAddress(item.id)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ })
|
|
|
+ }
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
<z-paging ref="paging" v-model="dataList" use-page-scroll @query="queryList">
|
|
|
<view class="py-20rpx">
|
|
|
- <view v-for="item in dataList" :key="item.id" class="flex items-center justify-between bg-white px-22rpx py-18rpx" @click="editAddress(item.id)">
|
|
|
- <view class="flex-1">
|
|
|
- <view class="mb-20rpx flex items-center justify-between text-24rpx">
|
|
|
- <view>
|
|
|
- <text class="mr-20rpx">
|
|
|
- {{ item.realName }}
|
|
|
- </text>
|
|
|
- <text>{{ item.phone }}</text>
|
|
|
+ <wd-swipe-action v-for="item in dataList" :key="item.id">
|
|
|
+ <view class="flex items-center justify-between bg-white px-22rpx py-18rpx" @click="editAddress(item.id)">
|
|
|
+ <view class="flex-1">
|
|
|
+ <view class="mb-20rpx flex items-center justify-between text-24rpx">
|
|
|
+ <view>
|
|
|
+ <text class="mr-20rpx">
|
|
|
+ {{ item.realName }}
|
|
|
+ </text>
|
|
|
+ <text>{{ item.phone }}</text>
|
|
|
+ </view>
|
|
|
+ <wd-text v-if="item.isDefault" type="primary" text="default" />
|
|
|
+ </view>
|
|
|
+ <view class="text-22rpx text-#3A444C">
|
|
|
+ {{ [item.province, item.city, item.district, item.street].filter(Boolean).join(', ') }} {{ item.postCode }}
|
|
|
</view>
|
|
|
- <wd-text v-if="item.isDefault" type="primary" text="default" />
|
|
|
- </view>
|
|
|
- <view class="text-22rpx text-#3A444C">
|
|
|
- {{ [item.province, item.city, item.district, item.street].filter(Boolean).join(', ') }} {{ item.postCode }}
|
|
|
</view>
|
|
|
+ <wd-icon name="arrow-right" custom-class="flex-shrink-0 ml-8rpx" color="#7D7D7D" size="24rpx" />
|
|
|
</view>
|
|
|
- <wd-icon name="arrow-right" custom-class="flex-shrink-0 ml-8rpx" color="#7D7D7D" size="24rpx" />
|
|
|
- </view>
|
|
|
+ <template #right>
|
|
|
+ <view class="action">
|
|
|
+ <view class="button" style="background:var(--wot-color-theme);" @click="handleAction('del', item)">
|
|
|
+ 删除
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </template>
|
|
|
+ </wd-swipe-action>
|
|
|
</view>
|
|
|
<template #bottom>
|
|
|
<view class="bg-white/60 px-28rpx py-30rpx backdrop-blur-20">
|
|
@@ -82,5 +134,14 @@ function editAddress(id: any) {
|
|
|
</template>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
-//
|
|
|
+.action {
|
|
|
+ height: 100%;
|
|
|
+ .button {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding: 0 24rpx;
|
|
|
+ height: 100%;
|
|
|
+ color: white;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|