feat: member detail add UserAddressList

apps/web-antd/src/api/member/address/index.ts

@@ -1,5 +1,3 @@
-import type { PageParam, PageResult } from '@vben/request';
-
 import { requestClient } from '#/api/request';
 
 export namespace MemberAddressApi {
@@ -15,11 +13,8 @@ export namespace MemberAddressApi {
 }
 
 /** 查询用户收件地址列表 */
-export function getAddressList(params: PageParam) {
-  return requestClient.get<PageResult<MemberAddressApi.Address>>(
-    '/member/address/list',
-    {
-      params,
-    },
-  );
+export function getAddressList(params: any) {
+  return requestClient.get<MemberAddressApi.Address[]>('/member/address/list', {
+    params,
+  });
 }

apps/web-antd/src/views/member/user/components/user-address-list.vue

@@ -0,0 +1,87 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MemberAddressApi } from '#/api/member/address';
+
+import { h } from 'vue';
+
+import { Tag } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getAddressList } from '#/api/member/address';
+
+const props = defineProps<{
+  userId: number;
+}>();
+
+const [Grid] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      {
+        field: 'id',
+        title: '地址编号',
+      },
+      {
+        field: 'name',
+        title: '收件人名称',
+      },
+      {
+        field: 'mobile',
+        title: '手机号',
+      },
+      {
+        field: 'areaId',
+        title: '地区编码',
+      },
+      {
+        field: 'detailAddress',
+        title: '收件详细地址',
+      },
+      {
+        field: 'defaultStatus',
+        title: '是否默认',
+        slots: {
+          default: ({ row }) => {
+            return h(
+              Tag,
+              {
+                class: 'mr-5px',
+                color: row.defaultStatus ? 'blue' : 'red',
+              },
+              () => (row.defaultStatus ? '是' : '否'),
+            );
+          },
+        },
+      },
+      {
+        field: 'createTime',
+        title: '创建时间',
+        formatter: 'formatDateTime',
+      },
+    ],
+    keepSource: true,
+    pagerConfig: {
+      enabled: false,
+    },
+    proxyConfig: {
+      ajax: {
+        query: async () => {
+          return await getAddressList({
+            userId: props.userId,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+    },
+    toolbarConfig: {
+      refresh: { code: 'query' },
+      search: true,
+    },
+  } as VxeTableGridOptions<MemberAddressApi.Address>,
+});
+</script>
+
+<template>
+  <Grid />
+</template>

apps/web-antd/src/views/member/user/modules/detail.vue

@@ -15,6 +15,7 @@ import { getWallet } from '#/api/pay/wallet/balance';
 import { $t } from '#/locales';
 
 import UserAccountInfo from '../components/user-account-info.vue';
+import UserAddressList from '../components/user-address-list.vue';
 import UserBalanceList from '../components/user-balance-list.vue';
 import UserBasicInfo from '../components/user-basic-info.vue';
 import UserExperienceRecordList from '../components/user-experience-record-list.vue';
@@ -94,7 +95,9 @@ onMounted(async () => {
           <TabPane tab="余额" key="UserBalanceList">
             <UserBalanceList class="h-full" :wallet-id="wallet?.id" />
           </TabPane>
-          <TabPane tab="收货地址" key="UserAddressList" />
+          <TabPane tab="收货地址" key="UserAddressList">
+            <UserAddressList class="h-full" :user-id="userId" />
+          </TabPane>
           <TabPane tab="订单管理" key="UserOrderList" />
           <TabPane tab="售后管理" key="UserAfterSaleList" />
           <TabPane tab="收藏记录" key="UserFavoriteList" />