oneos-v5/frontend
1
0
Fork 0
Code Issues Pull Requests Actions 4 Packages Projects Releases Wiki Activity

review：【antd】【ele】member 增加 address-list、favorite-list 列表

Browse Source
This commit is contained in:
YunaiV
2025-11-02 14:43:01 +08:00
parent 17ccc0a27f
commit 889b97370a
7 changed files with 289 additions and 206 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
apps/web-ele/src/views/member/user/detail/modules/address-list.vue Normal file
View File

@@ -0,0 +1,87 @@
<script lang="ts" setup>
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import type { MemberAddressApi } from '#/api/member/address';
import { DICT_TYPE } from '@vben/constants';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { getAddressList } from '#/api/member/address';
const props = defineProps<{
userId: number;
}>();
const columns = [
{
field: 'id',
title: '地址编号',
minWidth: 100,
},
{
field: 'name',
title: '收件人名称',
minWidth: 120,
},
{
field: 'mobile',
title: '手机号',
minWidth: 130,
},
{
field: 'areaId',
title: '地区编码',
minWidth: 120,
},
{
field: 'detailAddress',
title: '收件详细地址',
minWidth: 200,
},
{
field: 'defaultStatus',
title: '是否默认',
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.INFRA_BOOLEAN_STRING },
},
},
{
field: 'createTime',
title: '创建时间',
formatter: 'formatDateTime',
minWidth: 160,
},
];
const [Grid] = useVbenVxeGrid({
gridOptions: {
columns,
keepSource: true,
pagerConfig: {
enabled: false,
},
proxyConfig: {
ajax: {
query: async () => {
return await getAddressList({
userId: props.userId,
});
},
},
},
rowConfig: {
keyField: 'id',
isHover: true,
},
toolbarConfig: {
refresh: true,
search: true,
},
} as VxeTableGridOptions<MemberAddressApi.Address>,
});
</script>
<template>
<Grid />
</template>

101
apps/web-ele/src/views/member/user/detail/modules/user-favorite-list.vue → apps/web-ele/src/views/member/user/detail/modules/favorite-list.vue
View File

@@ -11,59 +11,64 @@ const props = defineProps<{
userId: number;
}>();
const columns = [
{
field: 'id',
title: '商品编号',
minWidth: 100,
},
{
field: 'picUrl',
title: '商品图',
minWidth: 100,
cellRender: {
name: 'CellImage',
props: {
width: 24,
height: 24,
},
},
},
{
field: 'name',
title: '商品名称',
minWidth: 200,
},
{
field: 'price',
title: '商品售价',
formatter: 'formatAmount2',
minWidth: 120,
},
{
field: 'salesCount',
title: '销量',
minWidth: 100,
},
{
field: 'createTime',
title: '收藏时间',
formatter: 'formatDateTime',
minWidth: 160,
},
{
field: 'status',
title: '状态',
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.PRODUCT_SPU_STATUS },
},
},
];
const [Grid] = useVbenVxeGrid({
gridOptions: {
columns: [
{
field: 'id',
title: '商品编号',
},
{
field: 'picUrl',
title: '商品图',
cellRender: {
name: 'CellImage',
props: {
height: 40,
width: 40,
},
},
},
{
field: 'name',
title: '商品名称',
},
{
field: 'price',
title: '商品售价',
},
{
field: 'salesCount',
title: '销量',
},
{
field: 'createTime',
title: '收藏时间',
formatter: 'formatDateTime',
},
{
field: 'status',
title: '状态',
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.PRODUCT_SPU_STATUS },
},
},
],
columns,
keepSource: true,
pagerConfig: {
pageSize: 10,
},
expandConfig: {
trigger: 'row',
expandAll: true,
padding: true,
},
proxyConfig: {
ajax: {
query: async ({ page }, formValues) => {
@@ -78,13 +83,13 @@ const [Grid] = useVbenVxeGrid({
},
rowConfig: {
keyField: 'id',
isHover: true,
},
toolbarConfig: {
refresh: true,
search: true,
},
} as VxeTableGridOptions<MallFavoriteApi.Favorite>,
separator: false,
});
</script>

94
apps/web-ele/src/views/member/user/detail/modules/user-address-list.vue
View File

@@ -1,94 +0,0 @@
<script lang="ts" setup>
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import type { MemberAddressApi } from '#/api/member/address';
import { h } from 'vue';
import { ElTag } from 'element-plus';
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: '地址编号',
minWidth: 100,
},
{
field: 'name',
title: '收件人名称',
minWidth: 120,
},
{
field: 'mobile',
title: '手机号',
minWidth: 130,
},
{
field: 'areaId',
title: '地区编码',
minWidth: 120,
},
{
field: 'detailAddress',
title: '收件详细地址',
minWidth: 200,
},
{
field: 'defaultStatus',
title: '是否默认',
minWidth: 100,
slots: {
default: ({ row }) => {
return h(
ElTag,
{
class: 'mr-1',
type: row.defaultStatus ? 'primary' : 'danger',
},
() => (row.defaultStatus ? '是' : '否'),
);
},
},
},
{
field: 'createTime',
title: '创建时间',
formatter: 'formatDateTime',
minWidth: 160,
},
],
keepSource: true,
pagerConfig: {
enabled: false,
},
proxyConfig: {
ajax: {
query: async () => {
return await getAddressList({
userId: props.userId,
});
},
},
},
rowConfig: {
keyField: 'id',
},
toolbarConfig: {
refresh: true,
search: true,
},
} as VxeTableGridOptions<MemberAddressApi.Address>,
});
</script>
<template>
<Grid />
</template>