From ba47b627c81b070e46faf580fbd0104587f7f3df Mon Sep 17 00:00:00 2001 From: YunaiV Date: Tue, 7 Oct 2025 10:30:24 +0800 Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A=E3=80=90antd=E3=80=91=E3=80=90ele?= =?UTF-8?q?=E3=80=91=E3=80=90member=20=E4=BC=9A=E5=91=98=E3=80=91level=20?= =?UTF-8?q?=E8=BF=81=E7=A7=BB=20ele?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- apps/web-antd/src/api/member/level/index.ts | 1 + apps/web-antd/src/views/member/level/data.ts | 2 +- .../src/views/member/level/modules/form.vue | 2 +- apps/web-ele/src/api/member/level/index.ts | 1 + apps/web-ele/src/views/member/group/index.vue | 7 +-- apps/web-ele/src/views/member/level/data.ts | 54 ++++++++++++++++--- apps/web-ele/src/views/member/level/index.vue | 16 ++++-- .../src/views/member/level/modules/form.vue | 4 +- 8 files changed, 68 insertions(+), 19 deletions(-) diff --git a/apps/web-antd/src/api/member/level/index.ts b/apps/web-antd/src/api/member/level/index.ts index 850d9b820..a856e505b 100644 --- a/apps/web-antd/src/api/member/level/index.ts +++ b/apps/web-antd/src/api/member/level/index.ts @@ -11,6 +11,7 @@ export namespace MemberLevelApi { icon: string; bgUrl: string; status: number; + createTime?: Date; } } diff --git a/apps/web-antd/src/views/member/level/data.ts b/apps/web-antd/src/views/member/level/data.ts index 0ceb1740d..cc173d9d3 100644 --- a/apps/web-antd/src/views/member/level/data.ts +++ b/apps/web-antd/src/views/member/level/data.ts @@ -71,7 +71,7 @@ export function useFormSchema(): VbenFormSchema[] { }, { fieldName: 'backgroundUrl', - label: '背景图', + label: '等级背景图', component: 'ImageUpload', }, { diff --git a/apps/web-antd/src/views/member/level/modules/form.vue b/apps/web-antd/src/views/member/level/modules/form.vue index be6ae20ed..6b7c094c1 100644 --- a/apps/web-antd/src/views/member/level/modules/form.vue +++ b/apps/web-antd/src/views/member/level/modules/form.vue @@ -26,7 +26,7 @@ const [Form, formApi] = useVbenForm({ componentProps: { class: 'w-full', }, - formItemClass: 'col-span-1', + formItemClass: 'col-span-2', labelWidth: 110, }, layout: 'horizontal', diff --git a/apps/web-ele/src/api/member/level/index.ts b/apps/web-ele/src/api/member/level/index.ts index 850d9b820..a856e505b 100644 --- a/apps/web-ele/src/api/member/level/index.ts +++ b/apps/web-ele/src/api/member/level/index.ts @@ -11,6 +11,7 @@ export namespace MemberLevelApi { icon: string; bgUrl: string; status: number; + createTime?: Date; } } diff --git a/apps/web-ele/src/views/member/group/index.vue b/apps/web-ele/src/views/member/group/index.vue index 5e06fc356..e7e06ed05 100644 --- a/apps/web-ele/src/views/member/group/index.vue +++ b/apps/web-ele/src/views/member/group/index.vue @@ -100,15 +100,16 @@ const [Grid, gridApi] = useVbenVxeGrid({ :actions="[ { label: $t('common.edit'), - type: 'link', + type: 'primary', + link: true, icon: ACTION_ICON.EDIT, auth: ['member:group:update'], onClick: handleEdit.bind(null, row), }, { label: $t('common.delete'), - type: 'link', - danger: true, + type: 'danger', + link: true, icon: ACTION_ICON.DELETE, auth: ['member:group:delete'], popConfirm: { diff --git a/apps/web-ele/src/views/member/level/data.ts b/apps/web-ele/src/views/member/level/data.ts index a9f4fcbd8..0d72df115 100644 --- a/apps/web-ele/src/views/member/level/data.ts +++ b/apps/web-ele/src/views/member/level/data.ts @@ -5,31 +5,40 @@ import { CommonStatusEnum, DICT_TYPE } from '@vben/constants'; import { getDictOptions } from '@vben/hooks'; import { z } from '#/adapter/form'; +import { getRangePickerDefaultProps } from '#/utils'; /** 新增/修改的表单 */ export function useFormSchema(): VbenFormSchema[] { return [ { - component: 'Input', fieldName: 'id', + component: 'Input', dependencies: { triggerFields: [''], show: () => false, }, }, { - component: 'Input', fieldName: 'name', label: '等级名称', + component: 'Input', + componentProps: { + placeholder: '请输入等级名称', + }, + rules: 'required', }, { - component: 'InputNumber', fieldName: 'level', label: '等级', + component: 'InputNumber', componentProps: { min: 0, precision: 0, + placeholder: '请输入等级', + controlsPosition: 'right', + class: '!w-full', }, + rules: 'required', }, { fieldName: 'experience', @@ -38,7 +47,11 @@ export function useFormSchema(): VbenFormSchema[] { componentProps: { min: 0, precision: 0, + placeholder: '请输入升级经验', + controlsPosition: 'right', + class: '!w-full', }, + rules: 'required', }, { fieldName: 'discountPercent', @@ -48,17 +61,21 @@ export function useFormSchema(): VbenFormSchema[] { min: 0, max: 100, precision: 0, + placeholder: '请输入享受折扣', + controlsPosition: 'right', + class: '!w-full', }, + rules: 'required', }, { - component: 'ImageUpload', fieldName: 'icon', label: '等级图标', + component: 'ImageUpload', }, { - component: 'ImageUpload', fieldName: 'backgroundUrl', label: '等级背景图', + component: 'ImageUpload', }, { fieldName: 'status', @@ -81,16 +98,30 @@ export function useGridFormSchema(): VbenFormSchema[] { fieldName: 'name', label: '等级名称', component: 'Input', + componentProps: { + placeholder: '请输入等级名称', + clearable: true, + }, }, { fieldName: 'status', label: '状态', component: 'Select', componentProps: { + placeholder: '请选择状态', clearable: true, options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'), }, }, + { + fieldName: 'createTime', + label: '创建时间', + component: 'RangePicker', + componentProps: { + ...getRangePickerDefaultProps(), + allowClear: true, + }, + }, ]; } @@ -99,11 +130,13 @@ export function useGridColumns(): VxeTableGridOptions['columns'] { return [ { field: 'id', - title: '编号', + title: '等级编号', + minWidth: 80, }, { field: 'icon', title: '等级图标', + minWidth: 100, cellRender: { name: 'CellImage', }, @@ -111,6 +144,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] { { field: 'backgroundUrl', title: '等级背景图', + minWidth: 120, cellRender: { name: 'CellImage', }, @@ -118,22 +152,27 @@ export function useGridColumns(): VxeTableGridOptions['columns'] { { field: 'name', title: '等级名称', + minWidth: 120, }, { field: 'level', title: '等级', + minWidth: 80, }, { field: 'experience', title: '升级经验', + minWidth: 100, }, { field: 'discountPercent', title: '享受折扣(%)', + minWidth: 120, }, { field: 'status', title: '状态', + minWidth: 80, cellRender: { name: 'CellDict', props: { type: DICT_TYPE.COMMON_STATUS }, @@ -142,11 +181,12 @@ export function useGridColumns(): VxeTableGridOptions['columns'] { { field: 'createTime', title: '创建时间', + minWidth: 180, formatter: 'formatDateTime', }, { title: '操作', - width: 130, + width: 180, fixed: 'right', slots: { default: 'actions' }, }, diff --git a/apps/web-ele/src/views/member/level/index.vue b/apps/web-ele/src/views/member/level/index.vue index 4bd017921..de500e2c9 100644 --- a/apps/web-ele/src/views/member/level/index.vue +++ b/apps/web-ele/src/views/member/level/index.vue @@ -2,7 +2,7 @@ import type { VxeTableGridOptions } from '#/adapter/vxe-table'; import type { MemberLevelApi } from '#/api/member/level'; -import { Page, useVbenModal } from '@vben/common-ui'; +import { DocAlert, Page, useVbenModal } from '@vben/common-ui'; import { ElLoading, ElMessage } from 'element-plus'; @@ -19,7 +19,7 @@ const [FormModal, formModalApi] = useVbenModal({ }); /** 刷新表格 */ -function onRefresh() { +function handleRefresh() { gridApi.query(); } @@ -41,7 +41,7 @@ async function handleDelete(row: MemberLevelApi.Level) { try { await deleteLevel(row.id as number); ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name])); - onRefresh(); + handleRefresh(); } finally { loadingInstance.close(); } @@ -60,7 +60,7 @@ const [Grid, gridApi] = useVbenVxeGrid({ }, proxyConfig: { ajax: { - query: async (_params, formValues) => { + query: async (_, formValues) => { return await getLevelList({ ...formValues, }); @@ -69,6 +69,7 @@ const [Grid, gridApi] = useVbenVxeGrid({ }, rowConfig: { keyField: 'id', + isHover: true, }, toolbarConfig: { refresh: true, @@ -80,7 +81,12 @@ const [Grid, gridApi] = useVbenVxeGrid({