!223 【antd】Member 迁移彻底完成

Merge pull request !223 from 芋道源码/dev

apps/web-antd/src/api/mall/promotion/coupon/coupon.ts

@@ -40,9 +40,9 @@ export namespace MallCouponApi {
   }
 
   /** 发送优惠券 */
-  export interface SendCoupon {
+  export interface CouponSendReqVO {
     /** 优惠券编号 */
-    couponId: number;
+    templateId: number;
     /** 用户编号数组 */
     userIds: number[];
   }
@@ -62,6 +62,6 @@ export function getCouponPage(params: PageParam) {
 }
 
 /** 发送优惠券 */
-export function sendCoupon(data: MallCouponApi.SendCoupon) {
+export function sendCoupon(data: MallCouponApi.CouponSendReqVO) {
   return requestClient.post('/promotion/coupon/send', data);
 }

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

@@ -11,6 +11,7 @@ export namespace MemberLevelApi {
     icon: string;
     bgUrl: string;
     status: number;
+    createTime?: Date;
   }
 }
 

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

@@ -20,20 +20,20 @@ export namespace MemberUserApi {
     status: number;
     areaId?: number;
     areaName?: string;
-    levelName: null | string;
+    levelName: string;
-    point?: null | number;
+    point?: number;
-    totalPoint?: null | number;
+    totalPoint?: number;
-    experience?: null | number;
+    experience?: number;
   }
 
   /** 会员用户等级更新信息 */
-  export interface UserLevelUpdate {
+  export interface UserUpdateLevelReqVO {
     id: number;
     levelId: number;
   }
 
   /** 会员用户积分更新信息 */
-  export interface UserPointUpdate {
+  export interface UserPointUpdateReqVO {
     id: number;
     point: number;
   }
@@ -60,11 +60,11 @@ export function updateUser(data: MemberUserApi.User) {
 }
 
 /** 修改会员用户等级 */
-export function updateUserLevel(data: MemberUserApi.UserLevelUpdate) {
+export function updateUserLevel(data: MemberUserApi.UserUpdateLevelReqVO) {
   return requestClient.put('/member/user/update-level', data);
 }
 
 /** 修改会员用户积分 */
-export function updateUserPoint(data: MemberUserApi.UserPointUpdate) {
+export function updateUserPoint(data: MemberUserApi.UserPointUpdateReqVO) {
   return requestClient.put('/member/user/update-point', data);
 }

apps/web-antd/src/api/pay/wallet/balance/index.ts

@@ -28,6 +28,12 @@ export namespace PayWalletApi {
     totalRecharge?: number;
     freezePrice?: number;
   }
+
+  /** 钱包修改余额 */
+  export interface PayWalletUpdateBalanceReqVO {
+    userId: number;
+    balance: number;
+  }
 }
 
 /** 查询用户钱包详情 */
@@ -48,6 +54,8 @@ export function getWalletPage(params: PayWalletApi.WalletPageReqVO) {
 }
 
 /** 修改会员钱包余额 */
-export function updateWalletBalance(data: PayWalletApi.Wallet) {
+export function updateWalletBalance(
+  data: PayWalletApi.PayWalletUpdateBalanceReqVO,
+) {
   return requestClient.put('/pay/wallet/update-balance', data);
 }

apps/web-antd/src/router/routes/modules/member.ts

@@ -3,11 +3,12 @@ import type { RouteRecordRaw } from 'vue-router';
 const routes: RouteRecordRaw[] = [
   {
     path: '/member/user/detail',
-    component: () => import('#/views/member/user/modules/detail.vue'),
+    component: () => import('#/views/member/user/detail/index.vue'),
     name: 'MemberUserDetail',
     meta: {
       title: '会员详情',
       icon: 'lucide:user',
+      activePath: '/member/user',
       hideInMenu: true,
     },
   },

apps/web-antd/src/views/ai/chat/index/data.ts

@@ -41,7 +41,6 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '温度参数',
       component: 'InputNumber',
       componentProps: {
-        controlsPosition: 'right',
         placeholder: '请输入温度参数',
         class: 'w-full',
         precision: 2,
@@ -55,7 +54,6 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '回复数 Token 数',
       component: 'InputNumber',
       componentProps: {
-        controlsPosition: 'right',
         placeholder: '请输入回复数 Token 数',
         class: 'w-full',
         min: 0,
@@ -68,7 +66,6 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '上下文数量',
       component: 'InputNumber',
       componentProps: {
-        controlsPosition: 'right',
         placeholder: '请输入上下文数量',
         class: 'w-full',
         min: 0,

apps/web-antd/src/views/ai/knowledge/document/data.ts

@@ -50,7 +50,6 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '检索 topK',
       component: 'InputNumber',
       componentProps: {
-        controlsPosition: 'right',
         placeholder: '请输入检索 topK',
         class: 'w-full',
         min: 0,
@@ -63,7 +62,6 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '检索相似度阈值',
       component: 'InputNumber',
       componentProps: {
-        controlsPosition: 'right',
         placeholder: '请输入检索相似度阈值',
         class: 'w-full',
         min: 0,

apps/web-antd/src/views/ai/knowledge/knowledge/data.ts

@@ -52,7 +52,6 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '检索 topK',
       component: 'InputNumber',
       componentProps: {
-        controlsPosition: 'right',
         placeholder: '请输入检索 topK',
         class: 'w-full',
         min: 0,
@@ -65,7 +64,6 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '检索相似度阈值',
       component: 'InputNumber',
       componentProps: {
-        controlsPosition: 'right',
         placeholder: '请输入检索相似度阈值',
         class: 'w-full',
         min: 0,

apps/web-antd/src/views/ai/model/chatRole/data.ts

@@ -136,7 +136,6 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '角色排序',
       component: 'InputNumber',
       componentProps: {
-        controlsPosition: 'right',
         placeholder: '请输入角色排序',
         class: 'w-full',
       },

apps/web-antd/src/views/ai/model/model/data.ts

@@ -72,7 +72,6 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '模型排序',
       component: 'InputNumber',
       componentProps: {
-        controlsPosition: 'right',
         placeholder: '请输入模型排序',
         class: 'w-full',
       },
@@ -94,7 +93,6 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '温度参数',
       component: 'InputNumber',
       componentProps: {
-        controlsPosition: 'right',
         placeholder: '请输入温度参数',
         class: 'w-full',
         min: 0,
@@ -115,7 +113,6 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         min: 0,
         max: 8192,
-        controlsPosition: 'right',
         placeholder: '请输入回复数 Token 数',
         class: 'w-full',
       },
@@ -134,7 +131,6 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         min: 0,
         max: 20,
-        controlsPosition: 'right',
         placeholder: '请输入上下文数量',
         class: 'w-full',
       },

apps/web-antd/src/views/bpm/category/data.ts

@@ -61,7 +61,6 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'InputNumber',
       componentProps: {
         min: 0,
-        controlsPosition: 'right',
         placeholder: '请输入分类排序',
         class: 'w-full',
       },

apps/web-antd/src/views/crm/contract/config/data.ts

@@ -0,0 +1,37 @@
+import type { VbenFormSchema } from '#/adapter/form';
+
+export const schema: VbenFormSchema[] = [
+  {
+    component: 'RadioGroup',
+    fieldName: 'notifyEnabled',
+    label: '提前提醒设置',
+    componentProps: {
+      options: [
+        { label: '提醒', value: true },
+        { label: '不提醒', value: false },
+      ],
+    },
+    defaultValue: true,
+  },
+  {
+    component: 'InputNumber',
+    fieldName: 'notifyDays',
+    componentProps: {
+      min: 0,
+      precision: 0,
+    },
+    renderComponentContent: () => ({
+      addonBefore: () => '提前',
+      addonAfter: () => '天提醒',
+    }),
+    dependencies: {
+      triggerFields: ['notifyEnabled'],
+      show: (values) => values.notifyEnabled,
+      trigger(values) {
+        if (!values.notifyEnabled) {
+          values.notifyDays = undefined;
+        }
+      },
+    },
+  },
+];

apps/web-antd/src/views/crm/contract/config/index.vue

@@ -1,5 +1,4 @@
 <script lang="ts" setup>
-import type { VbenFormSchema } from '#/adapter/form';
 import type { CrmContractConfigApi } from '#/api/crm/contract/config';
 
 import { onMounted } from 'vue';
@@ -15,51 +14,13 @@ import {
 } from '#/api/crm/contract/config';
 import { $t } from '#/locales';
 
-const emit = defineEmits(['success']);
+import { schema } from './data';
-
-const schema: VbenFormSchema[] = [
-  {
-    component: 'RadioGroup',
-    fieldName: 'notifyEnabled',
-    label: '提前提醒设置',
-    componentProps: {
-      options: [
-        { label: '提醒', value: true },
-        { label: '不提醒', value: false },
-      ],
-    },
-    defaultValue: true,
-  },
-  {
-    component: 'InputNumber',
-    fieldName: 'notifyDays',
-    componentProps: {
-      min: 0,
-      precision: 0,
-    },
-    renderComponentContent: () => ({
-      addonBefore: () => '提前',
-      addonAfter: () => '天提醒',
-    }),
-    dependencies: {
-      triggerFields: ['notifyEnabled'],
-      show: (values) => values.notifyEnabled,
-      trigger(values) {
-        if (!values.notifyEnabled) {
-          values.notifyDays = undefined;
-        }
-      },
-    },
-  },
-];
 
 const [Form, formApi] = useVbenForm({
   commonConfig: {
-    labelClass: 'w-2/6',
+    labelClass: 'w-100',
   },
   layout: 'horizontal',
-  wrapperClass: 'grid-cols-1',
-  actionWrapperClass: 'text-center',
   schema,
   handleSubmit,
 });
@@ -76,7 +37,6 @@ async function handleSubmit() {
   }
   await saveContractConfig(data);
   await formApi.setValues(data);
-  emit('success');
   message.success($t('ui.actionMessage.operationSuccess'));
 }
 

apps/web-antd/src/views/crm/customer/poolConfig/data.ts

@@ -0,0 +1,78 @@
+import type { VbenFormSchema } from '#/adapter/form';
+
+export const schema: VbenFormSchema[] = [
+  {
+    component: 'RadioGroup',
+    fieldName: 'enabled',
+    label: '客户公海规则设置',
+    componentProps: {
+      options: [
+        { label: '开启', value: true },
+        { label: '关闭', value: false },
+      ],
+    },
+  },
+  {
+    component: 'InputNumber',
+    fieldName: 'contactExpireDays',
+    componentProps: {
+      min: 0,
+      precision: 0,
+    },
+    renderComponentContent: () => ({
+      addonAfter: () => '天不跟进或',
+    }),
+    dependencies: {
+      triggerFields: ['enabled'],
+      show: (value) => value.enabled,
+    },
+  },
+  {
+    component: 'InputNumber',
+    fieldName: 'dealExpireDays',
+    renderComponentContent: () => ({
+      addonBefore: () => '或',
+      addonAfter: () => '天未成交',
+    }),
+    componentProps: {
+      min: 0,
+      precision: 0,
+    },
+    dependencies: {
+      triggerFields: ['enabled'],
+      show: (value) => value.enabled,
+    },
+  },
+  {
+    component: 'RadioGroup',
+    fieldName: 'notifyEnabled',
+    label: '提前提醒设置',
+    componentProps: {
+      options: [
+        { label: '开启', value: true },
+        { label: '关闭', value: false },
+      ],
+    },
+    dependencies: {
+      triggerFields: ['enabled'],
+      show: (value) => value.enabled,
+    },
+    defaultValue: false,
+  },
+  {
+    component: 'InputNumber',
+    fieldName: 'notifyDays',
+    componentProps: {
+      min: 0,
+      precision: 0,
+    },
+    renderComponentContent: () => ({
+      addonBefore: () => '提前',
+      addonAfter: () => '天提醒',
+    }),
+    dependencies: {
+      triggerFields: ['notifyEnabled'],
+      show: (value) => value.enabled && value.notifyEnabled,
+    },
+  },
+];

apps/web-antd/src/views/crm/customer/poolConfig/index.vue

@@ -1,5 +1,4 @@
 <script lang="ts" setup>
-import type { VbenFormSchema } from '#/adapter/form';
 import type { CrmCustomerPoolConfigApi } from '#/api/crm/customer/poolConfig';
 
 import { onMounted } from 'vue';
@@ -15,92 +14,13 @@ import {
 } from '#/api/crm/customer/poolConfig';
 import { $t } from '#/locales';
 
-const emit = defineEmits(['success']);
+import { schema } from './data';
-
-const schema: VbenFormSchema[] = [
-  {
-    component: 'RadioGroup',
-    fieldName: 'enabled',
-    label: '客户公海规则设置',
-    componentProps: {
-      options: [
-        { label: '开启', value: true },
-        { label: '关闭', value: false },
-      ],
-    },
-  },
-  {
-    component: 'InputNumber',
-    fieldName: 'contactExpireDays',
-    componentProps: {
-      min: 0,
-      precision: 0,
-    },
-    renderComponentContent: () => ({
-      addonAfter: () => '天不跟进或',
-    }),
-    dependencies: {
-      triggerFields: ['enabled'],
-      show: (value) => value.enabled,
-    },
-  },
-  {
-    component: 'InputNumber',
-    fieldName: 'dealExpireDays',
-    renderComponentContent: () => ({
-      addonBefore: () => '或',
-      addonAfter: () => '天未成交',
-    }),
-    componentProps: {
-      min: 0,
-      precision: 0,
-    },
-    dependencies: {
-      triggerFields: ['enabled'],
-      show: (value) => value.enabled,
-    },
-  },
-  {
-    component: 'RadioGroup',
-    fieldName: 'notifyEnabled',
-    label: '提前提醒设置',
-    componentProps: {
-      options: [
-        { label: '开启', value: true },
-        { label: '关闭', value: false },
-      ],
-    },
-    dependencies: {
-      triggerFields: ['enabled'],
-      show: (value) => value.enabled,
-    },
-    defaultValue: false,
-  },
-  {
-    component: 'InputNumber',
-    fieldName: 'notifyDays',
-    componentProps: {
-      min: 0,
-      precision: 0,
-    },
-    renderComponentContent: () => ({
-      addonBefore: () => '提前',
-      addonAfter: () => '天提醒',
-    }),
-    dependencies: {
-      triggerFields: ['notifyEnabled'],
-      show: (value) => value.enabled && value.notifyEnabled,
-    },
-  },
-];
 
 const [Form, formApi] = useVbenForm({
   commonConfig: {
-    labelClass: 'w-2/6',
+    labelClass: 'w-100',
   },
   layout: 'horizontal',
-  wrapperClass: 'grid-cols-1',
-  actionWrapperClass: 'text-center',
   schema,
   handleSubmit,
 });
@@ -125,7 +45,6 @@ async function handleSubmit() {
   await saveCustomerPoolConfig(data);
   // 关闭并提示
   await formApi.setValues(data);
-  emit('success');
   message.success($t('ui.actionMessage.operationSuccess'));
 }
 

apps/web-antd/src/views/erp/product/category/data.ts

@@ -66,7 +66,6 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'InputNumber',
       componentProps: {
         min: 0,
-        controlsPosition: 'right',
         placeholder: '请输入显示顺序',
       },
       rules: 'required',

apps/web-antd/src/views/infra/fileConfig/data.ts

@@ -83,7 +83,6 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'InputNumber',
       componentProps: {
         min: 0,
-        controlsPosition: 'right',
         placeholder: '请输入主机端口',
       },
       rules: 'required',

apps/web-antd/src/views/mall/product/brand/data.ts

@@ -36,7 +36,6 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'InputNumber',
       componentProps: {
         min: 0,
-        controlsPosition: 'right',
         placeholder: '请输入品牌排序',
       },
       rules: z.number().min(0).default(1),

apps/web-antd/src/views/mall/product/category/data.ts

@@ -66,7 +66,6 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'InputNumber',
       componentProps: {
         min: 0,
-        controlsPosition: 'right',
         placeholder: '请输入分类排序',
       },
       rules: z.number().min(0).default(1),

apps/web-antd/src/views/mall/promotion/article/category/data.ts

@@ -34,7 +34,6 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'InputNumber',
       componentProps: {
         min: 0,
-        controlsPosition: 'right',
         placeholder: '请输入排序',
       },
       rules: 'required',

apps/web-antd/src/views/mall/promotion/article/data.ts

@@ -84,7 +84,6 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'InputNumber',
       componentProps: {
         min: 0,
-        controlsPosition: 'right',
         placeholder: '请输入品牌排序',
       },
       rules: z.number().min(0).default(1),

apps/web-antd/src/views/mall/promotion/banner/data.ts

@@ -52,7 +52,6 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'InputNumber',
       componentProps: {
         min: 0,
-        controlsPosition: 'right',
         placeholder: '请输入排序',
       },
       rules: 'required',

apps/web-antd/src/views/mall/promotion/coupon/components/data.ts

@@ -0,0 +1,64 @@
+import type { VbenFormSchema } from '#/adapter/form';
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+import {
+  discountFormat,
+  remainedCountFormat,
+  usePriceFormat,
+  validityTypeFormat,
+} from '../formatter';
+
+/** 搜索表单的 schema */
+export function useFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      component: 'Input',
+      fieldName: 'name',
+      label: '优惠券名称',
+      componentProps: {
+        placeholder: '请输入优惠券名称',
+        allowClear: true,
+      },
+    },
+  ];
+}
+
+/** 表格列配置 */
+export function useGridColumns(): VxeGridProps['columns'] {
+  return [
+    {
+      title: '优惠券名称',
+      field: 'name',
+      minWidth: 120,
+    },
+    {
+      title: '优惠金额 / 折扣',
+      field: 'discount',
+      minWidth: 120,
+      formatter: ({ row }) => discountFormat(row),
+    },
+    {
+      title: '最低消费',
+      field: 'usePrice',
+      minWidth: 100,
+      formatter: ({ row }) => usePriceFormat(row),
+    },
+    {
+      title: '有效期限',
+      field: 'validityType',
+      minWidth: 140,
+      formatter: ({ row }) => validityTypeFormat(row),
+    },
+    {
+      title: '剩余数量',
+      minWidth: 100,
+      formatter: ({ row }) => remainedCountFormat(row),
+    },
+    {
+      title: '操作',
+      width: 100,
+      fixed: 'right',
+      slots: { default: 'actions' },
+    },
+  ];
+}

apps/web-antd/src/views/mall/promotion/coupon/components/index.ts

@@ -0,0 +1,2 @@
+export * from './data';
+export { default as CouponSendForm } from './send-form.vue';

apps/web-antd/src/views/mall/promotion/coupon/components/send-form.vue

@@ -0,0 +1,85 @@
+<script lang="ts" setup>
+import type { VxeGridProps } from '#/adapter/vxe-table';
+import type { MallCouponTemplateApi } from '#/api/mall/promotion/coupon/couponTemplate';
+
+import { useVbenModal } from '@vben/common-ui';
+import { CouponTemplateTakeTypeEnum } from '@vben/constants';
+
+import { message } from 'ant-design-vue';
+
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { sendCoupon } from '#/api/mall/promotion/coupon/coupon';
+import { getCouponTemplatePage } from '#/api/mall/promotion/coupon/couponTemplate';
+
+import { useFormSchema, useGridColumns } from './data';
+
+/** 发送优惠券 */
+async function handleSendCoupon(row: MallCouponTemplateApi.CouponTemplate) {
+  modalApi.lock();
+  try {
+    await sendCoupon({
+      templateId: row.id,
+      userIds: modalApi.getData().userIds,
+    });
+    message.success('发送成功');
+    await modalApi.close();
+  } finally {
+    modalApi.unlock();
+  }
+}
+
+const [Grid] = useVbenVxeGrid({
+  formOptions: {
+    schema: useFormSchema(),
+  },
+  gridOptions: {
+    columns: useGridColumns(),
+    height: 500,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) => {
+          return await getCouponTemplatePage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+            canTakeTypes: [CouponTemplateTakeTypeEnum.ADMIN.type],
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeGridProps<MallCouponTemplateApi.CouponTemplate>,
+});
+
+const [Modal, modalApi] = useVbenModal({
+  showCancelButton: false,
+  showConfirmButton: false,
+});
+</script>
+
+<template>
+  <Modal title="发送优惠劵" class="w-1/2">
+    <Grid>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '发送',
+              type: 'link',
+              auth: ['promotion:coupon:send'],
+              onClick: () => handleSendCoupon(row),
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </Modal>
+</template>

apps/web-antd/src/views/mall/trade/config/index.vue

@@ -64,7 +64,6 @@ const [Form, formApi] = useVbenForm({
     labelClass: 'w-2/6',
   },
   wrapperClass: 'grid-cols-1',
-  actionWrapperClass: 'text-center',
   handleSubmit: onSubmit,
   layout: 'horizontal',
   resetButtonOptions: {

apps/web-antd/src/views/member/config/data.ts

@@ -0,0 +1,52 @@
+import type { VbenFormSchema } from '#/adapter/form';
+
+export const schema: VbenFormSchema[] = [
+  {
+    component: 'Input',
+    fieldName: 'id',
+    dependencies: {
+      triggerFields: [''],
+      show: () => false,
+    },
+  },
+  {
+    component: 'Switch',
+    fieldName: 'pointTradeDeductEnable',
+    label: '积分抵扣',
+    help: '下单积分是否抵用订单金额',
+  },
+  {
+    component: 'InputNumber',
+    fieldName: 'pointTradeDeductUnitPrice',
+    label: '积分抵扣',
+    help: '积分抵用比例(1 积分抵多少金额)，单位：元',
+    componentProps: {
+      min: 0,
+      precision: 2,
+      class: 'w-full',
+      placeholder: '请输入积分抵扣单价',
+    },
+  },
+  {
+    component: 'InputNumber',
+    fieldName: 'pointTradeDeductMaxPrice',
+    label: '积分抵扣最大值',
+    help: '单次下单积分使用上限，0 不限制',
+    componentProps: {
+      min: 0,
+      class: 'w-full',
+      placeholder: '请输入积分抵扣最大值',
+    },
+  },
+  {
+    component: 'InputNumber',
+    fieldName: 'pointTradeGivePoint',
+    label: '1 元赠送多少分',
+    help: '下单支付金额按比例赠送积分（实际支付 1 元赠送多少积分）',
+    componentProps: {
+      min: 0,
+      class: 'w-full',
+      placeholder: '请输入赠送积分比例',
+    },
+  },
+];

apps/web-antd/src/views/member/config/index.vue

@@ -4,6 +4,7 @@ import type { MemberConfigApi } from '#/api/member/config';
 import { onMounted, ref } from 'vue';
 
 import { Page } from '@vben/common-ui';
+import { fenToYuan, yuanToFen } from '@vben/utils';
 
 import { Card, message } from 'ant-design-vue';
 
@@ -11,95 +12,47 @@ import { useVbenForm } from '#/adapter/form';
 import { getConfig, saveConfig } from '#/api/member/config';
 import { $t } from '#/locales';
 
-const emit = defineEmits(['success']);
+import { schema } from './data';
+
 const formData = ref<MemberConfigApi.Config>();
 
 const [Form, formApi] = useVbenForm({
   commonConfig: {
-    // 所有表单项
+    labelWidth: 120,
-    labelClass: 'w-2/6',
   },
   layout: 'horizontal',
-  wrapperClass: 'grid-cols-1',
+  schema,
-  actionWrapperClass: 'text-center',
+  handleSubmit,
-  schema: [
-    {
-      component: 'Input',
-      fieldName: 'id',
-      dependencies: {
-        triggerFields: [''],
-        show: () => false,
-      },
-    },
-    {
-      component: 'Switch',
-      fieldName: 'pointTradeDeductEnable',
-      label: '积分抵扣',
-      help: '开启后，用户可以积分抵扣',
-    },
-    {
-      component: 'InputNumber',
-      fieldName: 'pointTradeDeductUnitPrice',
-      label: '积分抵扣单价',
-      help: '用户每消费1元，可以抵扣多少积分',
-      componentProps: {
-        min: 0,
-        precision: 2,
-        class: 'w-full',
-      },
-    },
-    {
-      component: 'InputNumber',
-      fieldName: 'pointTradeDeductMaxPrice',
-      label: '积分抵扣最大值',
-      help: '单次下单积分使用上限，0 不限制',
-      componentProps: {
-        min: 0,
-        class: 'w-full',
-      },
-    },
-    {
-      component: 'InputNumber',
-      fieldName: 'pointTradeGivePoint',
-      label: '1 元赠送多少分',
-      help: '下单支付金额按比例赠送积分（实际支付 1 元赠送多少积分）',
-      componentProps: {
-        min: 0,
-        class: 'w-full',
-      },
-    },
-  ],
-  // 提交函数
-  handleSubmit: onSubmit,
 });
 
-async function onSubmit() {
+/** 提交表单 */
+async function handleSubmit() {
   const { valid } = await formApi.validate();
   if (!valid) {
     return;
   }
   // 提交表单
   const data = (await formApi.getValues()) as MemberConfigApi.Config;
-  formApi.setState({ commonConfig: { disabled: true } });
+  // 转换金额单位
-  try {
+  data.pointTradeDeductUnitPrice = yuanToFen(data.pointTradeDeductUnitPrice);
-    await saveConfig(data);
+  await saveConfig(data);
-    // 关闭并提示
+  // 关闭并提示
-    emit('success');
+  message.success($t('ui.actionMessage.operationSuccess'));
-    message.success($t('ui.actionMessage.operationSuccess'));
-  } finally {
-    formApi.setState({ commonConfig: { disabled: false } });
-  }
 }
 
+/** 获取配置 */
 async function getConfigInfo() {
-  try {
+  const res = await getConfig();
-    const res = await getConfig();
+  formData.value = res;
-    formData.value = res;
+  // 转换金额单位
-  } catch (error) {
+  res.pointTradeDeductUnitPrice = Number.parseFloat(
-    console.error(error);
+    fenToYuan(res.pointTradeDeductUnitPrice),
-  }
+  );
+  // 设置到 values
+  await formApi.setValues(res);
 }
 
+/** 初始化 */
 onMounted(() => {
   getConfigInfo();
 });

apps/web-antd/src/views/member/group/data.ts

@@ -10,17 +10,18 @@ import { z } from '#/adapter/form';
 export function useFormSchema(): VbenFormSchema[] {
   return [
     {
-      component: 'Input',
       fieldName: 'id',
+      component: 'Input',
       dependencies: {
         triggerFields: [''],
         show: () => false,
       },
     },
     {
-      component: 'Input',
       fieldName: 'name',
       label: '分组名称',
+      component: 'Input',
+      rules: 'required',
     },
     {
       fieldName: 'status',
@@ -33,6 +34,14 @@ export function useFormSchema(): VbenFormSchema[] {
       },
       rules: z.number().default(CommonStatusEnum.ENABLE),
     },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+      },
+    },
   ];
 }
 
@@ -43,14 +52,28 @@ export function useGridFormSchema(): VbenFormSchema[] {
       fieldName: 'name',
       label: '分组名称',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入分组名称',
+        allowClear: true,
+      },
     },
     {
       fieldName: 'status',
       label: '状态',
       component: 'Select',
       componentProps: {
-        allowClear: true,
         options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
+        placeholder: '请选择状态',
+        allowClear: true,
+      },
+    },
+    {
+      fieldName: 'createTime',
+      label: '创建时间',
+      component: 'RangePicker',
+      componentProps: {
+        placeholder: ['开始日期', '结束日期'],
+        allowClear: true,
       },
     },
   ];
@@ -62,14 +85,23 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'id',
       title: '编号',
+      minWidth: 100,
     },
     {
       field: 'name',
       title: '分组名称',
+      minWidth: 150,
+    },
+    {
+      field: 'remark',
+      title: '备注',
+      minWidth: 200,
+      showOverflow: 'tooltip',
     },
     {
       field: 'status',
       title: '状态',
+      minWidth: 100,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.COMMON_STATUS },
@@ -78,6 +110,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'createTime',
       title: '创建时间',
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {

apps/web-antd/src/views/member/group/index.vue

@@ -19,7 +19,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function onRefresh() {
+function handleRefresh() {
   gridApi.query();
 }
 
@@ -40,11 +40,9 @@ async function handleDelete(row: MemberGroupApi.Group) {
     duration: 0,
   });
   try {
-    await deleteGroup(row.id as number);
+    await deleteGroup(row.id!);
-    message.success({
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
-      content: $t('ui.actionMessage.deleteSuccess', [row.name]),
+    handleRefresh();
-    });
-    onRefresh();
   } finally {
     hideLoading();
   }
@@ -71,6 +69,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
@@ -82,7 +81,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="onRefresh" />
+    <FormModal @success="handleRefresh" />
     <Grid table-title="分组列表">
       <template #toolbar-tools>
         <TableAction

apps/web-antd/src/views/member/group/modules/form.vue

@@ -17,8 +17,8 @@ const emit = defineEmits(['success']);
 const formData = ref<MemberGroupApi.Group>();
 const getTitle = computed(() => {
   return formData.value?.id
-    ? $t('ui.actionTitle.edit', ['会员分组'])
+    ? $t('ui.actionTitle.edit', ['分组'])
-    : $t('ui.actionTitle.create', ['会员分组']);
+    : $t('ui.actionTitle.create', ['分组']);
 });
 
 const [Form, formApi] = useVbenForm({
@@ -76,7 +76,7 @@ const [Modal, modalApi] = useVbenModal({
 </script>
 
 <template>
-  <Modal class="w-2/5" :title="getTitle">
+  <Modal :title="getTitle" class="w-1/2">
     <Form class="mx-4" />
   </Modal>
 </template>

apps/web-antd/src/views/member/level/data.ts

@@ -5,31 +5,38 @@ 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: '请输入等级',
       },
+      rules: 'required',
     },
     {
       fieldName: 'experience',
@@ -38,7 +45,9 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         min: 0,
         precision: 0,
+        placeholder: '请输入升级经验',
       },
+      rules: 'required',
     },
     {
       fieldName: 'discountPercent',
@@ -48,17 +57,19 @@ export function useFormSchema(): VbenFormSchema[] {
         min: 0,
         max: 100,
         precision: 0,
+        placeholder: '请输入享受折扣',
       },
+      rules: 'required',
     },
     {
-      component: 'ImageUpload',
       fieldName: 'icon',
       label: '等级图标',
+      component: 'ImageUpload',
     },
     {
-      component: 'ImageUpload',
       fieldName: 'backgroundUrl',
       label: '等级背景图',
+      component: 'ImageUpload',
     },
     {
       fieldName: 'status',
@@ -81,16 +92,30 @@ export function useGridFormSchema(): VbenFormSchema[] {
       fieldName: 'name',
       label: '等级名称',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入等级名称',
+        allowClear: true,
+      },
     },
     {
       fieldName: 'status',
       label: '状态',
       component: 'Select',
       componentProps: {
+        placeholder: '请选择状态',
         allowClear: true,
         options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
       },
     },
+    {
+      fieldName: 'createTime',
+      label: '创建时间',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+        allowClear: true,
+      },
+    },
   ];
 }
 
@@ -99,11 +124,13 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
   return [
     {
       field: 'id',
-      title: '编号',
+      title: '等级编号',
+      minWidth: 80,
     },
     {
       field: 'icon',
       title: '等级图标',
+      minWidth: 100,
       cellRender: {
         name: 'CellImage',
       },
@@ -111,6 +138,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'backgroundUrl',
       title: '等级背景图',
+      minWidth: 120,
       cellRender: {
         name: 'CellImage',
       },
@@ -118,22 +146,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 +175,12 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'createTime',
       title: '创建时间',
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {
       title: '操作',
-      width: 130,
+      width: 180,
       fixed: 'right',
       slots: { default: 'actions' },
     },

apps/web-antd/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 { message } from 'ant-design-vue';
 
@@ -19,7 +19,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function onRefresh() {
+function handleRefresh() {
   gridApi.query();
 }
 
@@ -41,10 +41,8 @@ async function handleDelete(row: MemberLevelApi.Level) {
   });
   try {
     await deleteLevel(row.id as number);
-    message.success({
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
-      content: $t('ui.actionMessage.deleteSuccess', [row.name]),
+    handleRefresh();
-    });
-    onRefresh();
   } finally {
     hideLoading();
   }
@@ -63,7 +61,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     proxyConfig: {
       ajax: {
-        query: async (_params, formValues) => {
+        query: async (_, formValues) => {
           return await getLevelList({
             ...formValues,
           });
@@ -72,6 +70,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
@@ -83,7 +82,12 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="onRefresh" />
+    <DocAlert
+      title="会员等级、积分、签到"
+      url="https://doc.iocoder.cn/member/level/"
+    />
+
+    <FormModal @success="handleRefresh" />
     <Grid table-title="等级列表">
       <template #toolbar-tools>
         <TableAction

apps/web-antd/src/views/member/level/modules/form.vue

@@ -27,7 +27,7 @@ const [Form, formApi] = useVbenForm({
       class: 'w-full',
     },
     formItemClass: 'col-span-2',
-    labelWidth: 80,
+    labelWidth: 110,
   },
   layout: 'horizontal',
   schema: useFormSchema(),
@@ -76,7 +76,7 @@ const [Modal, modalApi] = useVbenModal({
 </script>
 
 <template>
-  <Modal class="w-2/5" :title="getTitle">
+  <Modal :title="getTitle" class="w-1/2">
     <Form class="mx-4" />
   </Modal>
 </template>

apps/web-antd/src/views/member/point/record/data.ts

@@ -17,12 +17,17 @@ export function useGridFormSchema(): VbenFormSchema[] {
       fieldName: 'nickname',
       label: '用户',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入用户昵称',
+        allowClear: true,
+      },
     },
     {
       fieldName: 'bizType',
       label: '业务类型',
       component: 'Select',
       componentProps: {
+        placeholder: '请选择业务类型',
         allowClear: true,
         options: getDictOptions(DICT_TYPE.MEMBER_POINT_BIZ_TYPE, 'number'),
       },
@@ -31,6 +36,10 @@ export function useGridFormSchema(): VbenFormSchema[] {
       fieldName: 'title',
       label: '积分标题',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入积分标题',
+        allowClear: true,
+      },
     },
     {
       fieldName: 'createDate',
@@ -50,25 +59,28 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'id',
       title: '编号',
+      minWidth: 100,
     },
     {
       field: 'createTime',
       title: '获得时间',
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {
       field: 'nickname',
       title: '用户',
+      minWidth: 150,
     },
     {
       field: 'point',
       title: '获得积分',
+      minWidth: 120,
       slots: {
         default: ({ row }) => {
           return h(
             Tag,
             {
-              class: 'mr-1',
               color: row.point > 0 ? 'blue' : 'red',
             },
             () => (row.point > 0 ? `+${row.point}` : row.point),
@@ -79,22 +91,27 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'totalPoint',
       title: '总积分',
+      minWidth: 100,
     },
     {
       field: 'title',
       title: '标题',
+      minWidth: 200,
     },
     {
       field: 'description',
       title: '描述',
+      minWidth: 200,
     },
     {
       field: 'bizId',
       title: '业务编码',
+      minWidth: 120,
     },
     {
       field: 'bizType',
       title: '业务类型',
+      minWidth: 120,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.MEMBER_POINT_BIZ_TYPE },

apps/web-antd/src/views/member/point/record/index.vue

@@ -2,7 +2,7 @@
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { MemberPointRecordApi } from '#/api/member/point/record';
 
-import { Page } from '@vben/common-ui';
+import { DocAlert, Page } from '@vben/common-ui';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getRecordPage } from '#/api/member/point/record';
@@ -30,6 +30,7 @@ const [Grid] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
@@ -41,6 +42,11 @@ const [Grid] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
+    <DocAlert
+      title="会员等级、积分、签到"
+      url="https://doc.iocoder.cn/member/level/"
+    />
+
     <Grid table-title="积分记录列表" />
   </Page>
 </template>

apps/web-antd/src/views/member/signin/config/data.ts

@@ -26,7 +26,9 @@ export function useFormSchema(): VbenFormSchema[] {
         min: 1,
         max: 7,
         precision: 0,
+        placeholder: '请输入签到天数',
       },
+      rules: z.number().min(1).max(7, '签到天数必须在 1-7 之间'),
     },
     {
       component: 'InputNumber',
@@ -35,7 +37,9 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         min: 0,
         precision: 0,
+        placeholder: '请输入获得积分',
       },
+      rules: z.number().min(0, '获得积分不能小于 0'),
     },
     {
       component: 'InputNumber',
@@ -44,7 +48,9 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         min: 0,
         precision: 0,
+        placeholder: '请输入奖励经验',
       },
+      rules: z.number().min(0, '奖励经验不能小于 0'),
     },
     {
       fieldName: 'status',
@@ -63,39 +69,34 @@ export function useFormSchema(): VbenFormSchema[] {
 /** 列表的字段 */
 export function useGridColumns(): VxeTableGridOptions['columns'] {
   return [
-    {
-      field: 'id',
-      title: '编号',
-    },
     {
       field: 'day',
       title: '签到天数',
+      minWidth: 120,
       formatter: ({ cellValue }) => ['第', cellValue, '天'].join(' '),
     },
     {
       field: 'point',
       title: '获得积分',
+      minWidth: 120,
     },
     {
       field: 'experience',
       title: '奖励经验',
+      minWidth: 120,
     },
     {
       field: 'status',
       title: '状态',
+      minWidth: 100,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.COMMON_STATUS },
       },
     },
-    {
-      field: 'createTime',
-      title: '创建时间',
-      formatter: 'formatDateTime',
-    },
     {
       title: '操作',
-      width: 130,
+      width: 150,
       fixed: 'right',
       slots: { default: 'actions' },
     },

apps/web-antd/src/views/member/signin/config/index.vue

@@ -2,7 +2,7 @@
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { MemberSignInConfigApi } from '#/api/member/signin/config';
 
-import { Page, useVbenModal } from '@vben/common-ui';
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
 
 import { message } from 'ant-design-vue';
 
@@ -22,7 +22,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function onRefresh() {
+function handleRefresh() {
   gridApi.query();
 }
 
@@ -44,10 +44,8 @@ async function handleDelete(row: MemberSignInConfigApi.SignInConfig) {
   });
   try {
     await deleteSignInConfig(row.id as number);
-    message.success({
+    message.success($t('ui.actionMessage.deleteSuccess'));
-      content: $t('ui.actionMessage.deleteSuccess'),
+    handleRefresh();
-    });
-    onRefresh();
   } finally {
     hideLoading();
   }
@@ -70,6 +68,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
@@ -81,7 +80,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="onRefresh" />
+    <template #doc>
+      <DocAlert
+        title="会员等级、积分、签到"
+        url="https://doc.iocoder.cn/member/level/"
+      />
+    </template>
+
+    <FormModal @success="handleRefresh" />
     <Grid table-title="签到配置列表">
       <template #toolbar-tools>
         <TableAction

apps/web-antd/src/views/member/signin/config/modules/form.vue

@@ -31,7 +31,7 @@ const [Form, formApi] = useVbenForm({
       class: 'w-full',
     },
     formItemClass: 'col-span-2',
-    labelWidth: 80,
+    labelWidth: 90,
   },
   layout: 'horizontal',
   schema: useFormSchema(),

apps/web-antd/src/views/member/signin/record/data.ts

@@ -14,11 +14,19 @@ export function useGridFormSchema(): VbenFormSchema[] {
       fieldName: 'nickname',
       label: '签到用户',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入签到用户',
+        allowClear: true,
+      },
     },
     {
       fieldName: 'day',
       label: '签到天数',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入签到天数',
+        allowClear: true,
+      },
     },
     {
       fieldName: 'createTime',
@@ -38,19 +46,23 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'id',
       title: '编号',
+      minWidth: 100,
     },
     {
       field: 'nickname',
       title: '签到用户',
+      minWidth: 150,
     },
     {
       field: 'day',
       title: '签到天数',
+      minWidth: 120,
       formatter: ({ cellValue }) => ['第', cellValue, '天'].join(' '),
     },
     {
       field: 'point',
       title: '获得积分',
+      minWidth: 120,
       slots: {
         default: ({ row }) => {
           return h(
@@ -67,6 +79,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'createTime',
       title: '签到时间',
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
   ];

apps/web-antd/src/views/member/signin/record/index.vue

@@ -2,7 +2,7 @@
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { MemberSignInRecordApi } from '#/api/member/signin/record';
 
-import { Page } from '@vben/common-ui';
+import { DocAlert, Page } from '@vben/common-ui';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getSignInRecordPage } from '#/api/member/signin/record';
@@ -30,6 +30,7 @@ const [Grid] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
@@ -41,6 +42,12 @@ const [Grid] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="会员等级、积分、签到"
+        url="https://doc.iocoder.cn/member/level/"
+      />
+    </template>
     <Grid table-title="签到记录列表" />
   </Page>
 </template>

apps/web-antd/src/views/member/tag/data.ts

@@ -18,6 +18,9 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'Input',
       fieldName: 'name',
       label: '标签名称',
+      componentProps: {
+        placeholder: '请输入标签名称',
+      },
       rules: 'required',
     },
   ];
@@ -30,6 +33,10 @@ export function useGridFormSchema(): VbenFormSchema[] {
       fieldName: 'name',
       label: '标签名称',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入标签名称',
+        allowClear: true,
+      },
     },
     {
       fieldName: 'createTime',
@@ -37,6 +44,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       component: 'RangePicker',
       componentProps: {
         ...getRangePickerDefaultProps(),
+        placeholder: ['开始日期', '结束日期'],
       },
     },
   ];
@@ -48,14 +56,17 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'id',
       title: '编号',
+      minWidth: 100,
     },
     {
       field: 'name',
       title: '标签名称',
+      minWidth: 200,
     },
     {
       field: 'createTime',
       title: '创建时间',
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {

apps/web-antd/src/views/member/tag/index.vue

@@ -19,7 +19,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function onRefresh() {
+function handleRefresh() {
   gridApi.query();
 }
 
@@ -41,10 +41,8 @@ async function handleDelete(row: MemberTagApi.Tag) {
   });
   try {
     await deleteMemberTag(row.id as number);
-    message.success({
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
-      content: $t('ui.actionMessage.deleteSuccess', [row.name]),
+    handleRefresh();
-    });
-    onRefresh();
   } finally {
     hideLoading();
   }
@@ -71,6 +69,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
@@ -88,7 +87,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
         url="https://doc.iocoder.cn/member/user/"
       />
     </template>
-    <FormModal @success="onRefresh" />
+    <FormModal @success="handleRefresh" />
     <Grid table-title="会员标签列表">
       <template #toolbar-tools>
         <TableAction

apps/web-antd/src/views/member/user/data.ts

@@ -16,21 +16,21 @@ import { getSimpleTagList } from '#/api/member/tag';
 import { getAreaTree } from '#/api/system/area';
 import { getRangePickerDefaultProps } from '#/utils';
 
-/** 修改的表单 */
+/** 新增/修改的表单 */
 export function useFormSchema(): VbenFormSchema[] {
   return [
     {
-      component: 'Input',
       fieldName: 'id',
+      component: 'Input',
       dependencies: {
         triggerFields: [''],
         show: () => false,
       },
     },
     {
-      component: 'Input',
       fieldName: 'mobile',
       label: '手机号',
+      component: 'Input',
       rules: 'required',
     },
     {
@@ -45,19 +45,25 @@ export function useFormSchema(): VbenFormSchema[] {
       rules: z.number().default(CommonStatusEnum.ENABLE).optional(),
     },
     {
-      component: 'Input',
       fieldName: 'nickname',
       label: '用户昵称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入用户昵称',
+      },
     },
     {
-      component: 'ImageUpload',
       fieldName: 'avatar',
       label: '头像',
+      component: 'ImageUpload',
     },
     {
-      component: 'Input',
       fieldName: 'name',
       label: '真实名字',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入真实名字',
+      },
     },
     {
       fieldName: 'sex',
@@ -70,45 +76,53 @@ export function useFormSchema(): VbenFormSchema[] {
       },
     },
     {
-      component: 'DatePicker',
       fieldName: 'birthday',
       label: '出生日期',
+      component: 'DatePicker',
       componentProps: {
         format: 'YYYY-MM-DD',
+        valueFormat: 'x',
+        placeholder: '请选择出生日期',
       },
     },
     {
-      component: 'ApiTreeSelect',
       fieldName: 'areaId',
       label: '所在地',
+      component: 'ApiTreeSelect',
       componentProps: {
         api: () => getAreaTree(),
         fieldNames: { label: 'name', value: 'id', children: 'children' },
+        placeholder: '请选择所在地',
       },
     },
     {
-      component: 'ApiSelect',
       fieldName: 'tagIds',
       label: '用户标签',
+      component: 'ApiSelect',
       componentProps: {
         api: () => getSimpleTagList(),
         fieldNames: { label: 'name', value: 'id' },
         mode: 'multiple',
+        placeholder: '请选择用户标签',
       },
     },
     {
-      component: 'ApiSelect',
       fieldName: 'groupId',
       label: '用户分组',
+      component: 'ApiSelect',
       componentProps: {
         api: () => getSimpleGroupList(),
         fieldNames: { label: 'name', value: 'id' },
+        placeholder: '请选择用户分组',
       },
     },
     {
-      component: 'Textarea',
       fieldName: 'mark',
       label: '会员备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入会员备注',
+      },
     },
   ];
 }
@@ -120,11 +134,19 @@ export function useGridFormSchema(): VbenFormSchema[] {
       fieldName: 'nickname',
       label: '用户昵称',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入用户昵称',
+        allowClear: true,
+      },
     },
     {
       fieldName: 'mobile',
       label: '手机号',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入手机号',
+        allowClear: true,
+      },
     },
     {
       fieldName: 'loginDate',
@@ -132,6 +154,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       component: 'RangePicker',
       componentProps: {
         ...getRangePickerDefaultProps(),
+        allowClear: true,
       },
     },
     {
@@ -140,6 +163,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       component: 'RangePicker',
       componentProps: {
         ...getRangePickerDefaultProps(),
+        allowClear: true,
       },
     },
     {
@@ -150,6 +174,8 @@ export function useGridFormSchema(): VbenFormSchema[] {
         api: () => getSimpleTagList(),
         fieldNames: { label: 'name', value: 'id' },
         mode: 'multiple',
+        placeholder: '请选择用户标签',
+        allowClear: true,
       },
     },
     {
@@ -159,6 +185,8 @@ export function useGridFormSchema(): VbenFormSchema[] {
       componentProps: {
         api: () => getSimpleLevelList(),
         fieldNames: { label: 'name', value: 'id' },
+        placeholder: '请选择用户等级',
+        allowClear: true,
       },
     },
     {
@@ -168,6 +196,8 @@ export function useGridFormSchema(): VbenFormSchema[] {
       componentProps: {
         api: () => getSimpleGroupList(),
         fieldNames: { label: 'name', value: 'id' },
+        placeholder: '请选择用户分组',
+        allowClear: true,
       },
     },
   ];
@@ -183,38 +213,40 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'id',
       title: '用户编号',
+      minWidth: 100,
     },
     {
       field: 'avatar',
       title: '头像',
-      slots: {
+      minWidth: 80,
-        default: ({ row }) => {
+      cellRender: {
-          return h('img', {
+        name: 'CellImage',
-            src: row.avatar,
-            style: { width: '40px' },
-          });
-        },
       },
     },
     {
       field: 'mobile',
       title: '手机号',
+      minWidth: 120,
     },
     {
       field: 'nickname',
       title: '昵称',
+      minWidth: 120,
     },
     {
       field: 'levelName',
       title: '等级',
+      minWidth: 100,
     },
     {
       field: 'groupName',
       title: '分组',
+      minWidth: 100,
     },
     {
       field: 'tagNames',
       title: '用户标签',
+      minWidth: 150,
       slots: {
         default: ({ row }) => {
           return row.tagNames?.map((tagName: string, index: number) => {
@@ -234,10 +266,12 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'point',
       title: '积分',
+      minWidth: 80,
     },
     {
       field: 'status',
       title: '状态',
+      minWidth: 80,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.COMMON_STATUS },
@@ -246,11 +280,13 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'loginDate',
       title: '登录时间',
+      minWidth: 160,
       formatter: 'formatDateTime',
     },
     {
       field: 'createTime',
       title: '注册时间',
+      minWidth: 160,
       formatter: 'formatDateTime',
     },
     {
@@ -266,34 +302,39 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
 export function useLevelFormSchema(): VbenFormSchema[] {
   return [
     {
-      component: 'Input',
       fieldName: 'id',
       label: '用户编号',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      component: 'Input',
       fieldName: 'nickname',
       label: '用户昵称',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      fieldName: 'point',
+      fieldName: 'levelId',
       label: '用户等级',
       component: 'ApiSelect',
       componentProps: {
         api: () => getSimpleLevelList(),
         fieldNames: { label: 'name', value: 'id' },
+        placeholder: '请选择用户等级',
+        allowClear: true,
       },
     },
     {
-      component: 'Textarea',
       fieldName: 'reason',
       label: '修改原因',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入修改原因',
+      },
       rules: 'required',
     },
   ];
@@ -303,33 +344,33 @@ export function useLevelFormSchema(): VbenFormSchema[] {
 export function useBalanceFormSchema(): VbenFormSchema[] {
   return [
     {
-      component: 'Input',
       fieldName: 'id',
       label: '用户编号',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      component: 'Input',
       fieldName: 'nickname',
       label: '用户昵称',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      component: 'Input',
       fieldName: 'balance',
       label: '变动前余额(元)',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      component: 'RadioGroup',
       fieldName: 'changeType',
       label: '变动类型',
+      component: 'RadioGroup',
       componentProps: {
         options: [
           { label: '增加', value: 1 },
@@ -341,23 +382,24 @@ export function useBalanceFormSchema(): VbenFormSchema[] {
       defaultValue: 1,
     },
     {
-      component: 'InputNumber',
       fieldName: 'changeBalance',
       label: '变动余额(元)',
+      component: 'InputNumber',
       rules: 'required',
       componentProps: {
         min: 0,
         precision: 2,
         step: 0.1,
+        placeholder: '请输入变动余额',
       },
       defaultValue: 0,
     },
     {
-      component: 'Input',
       fieldName: 'balanceResult',
       label: '变动后余额(元)',
+      component: 'Input',
       dependencies: {
-        triggerFields: ['changeBalance', 'changeType'],
+        triggerFields: ['balance', 'changeBalance', 'changeType'],
         disabled: true,
         trigger(values, form) {
           form.setFieldValue(
@@ -377,33 +419,33 @@ export function useBalanceFormSchema(): VbenFormSchema[] {
 export function usePointFormSchema(): VbenFormSchema[] {
   return [
     {
-      component: 'Input',
       fieldName: 'id',
       label: '用户编号',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      component: 'Input',
       fieldName: 'nickname',
       label: '用户昵称',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      component: 'Input',
       fieldName: 'point',
       label: '变动前积分',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      component: 'RadioGroup',
       fieldName: 'changeType',
       label: '变动类型',
+      component: 'RadioGroup',
       componentProps: {
         options: [
           { label: '增加', value: 1 },
@@ -415,22 +457,25 @@ export function usePointFormSchema(): VbenFormSchema[] {
       defaultValue: 1,
     },
     {
-      component: 'InputNumber',
       fieldName: 'changePoint',
       label: '变动积分',
+      component: 'InputNumber',
       rules: 'required',
       componentProps: {
         min: 0,
         precision: 0,
+        placeholder: '请输入变动积分',
       },
-      defaultValue: 0,
     },
     {
-      component: 'Input',
       fieldName: 'pointResult',
       label: '变动后积分',
+      component: 'Input',
+      componentProps: {
+        placeholder: '',
+      },
       dependencies: {
-        triggerFields: ['changePoint', 'changeType'],
+        triggerFields: ['point', 'changePoint', 'changeType'],
         disabled: true,
         trigger(values, form) {
           form.setFieldValue(

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

@@ -14,14 +14,14 @@ import { getUser } from '#/api/member/user';
 import { getWallet } from '#/api/pay/wallet/balance';
 import { $t } from '#/locales';
 
-import UserAccountInfo from '../components/user-account-info.vue';
+import Form from '../modules/form.vue';
-import UserAddressList from '../components/user-address-list.vue';
+import AccountInfo from './modules/account-info.vue';
-import UserBalanceList from '../components/user-balance-list.vue';
+import AddressList from './modules/address-list.vue';
-import UserBasicInfo from '../components/user-basic-info.vue';
+import BalanceList from './modules/balance-list.vue';
-import UserExperienceRecordList from '../components/user-experience-record-list.vue';
+import BasicInfo from './modules/basic-info.vue';
-import UserPointList from '../components/user-point-list.vue';
+import ExperienceRecordList from './modules/experience-record-list.vue';
-import UserSignList from '../components/user-sign-list.vue';
+import PointList from './modules/point-list.vue';
-import Form from './form.vue';
+import SignList from './modules/sign-list.vue';
 
 const route = useRoute();
 const { closeCurrentTab, refreshTab } = useTabs();
@@ -34,27 +34,28 @@ const [FormModal, formModalApi] = useVbenModal({
 const userId = Number(route.query.id);
 const user = ref<MemberUserApi.User>();
 const wallet = ref<PayWalletApi.Wallet>();
-/* 钱包初始化数据 */
-const WALLET_INIT_DATA = {
-  balance: 0,
-  totalExpense: 0,
-  totalRecharge: 0,
-} as PayWalletApi.Wallet;
 
+/** 获取会员详情 */
 async function getUserDetail() {
   if (!userId) {
     message.error('参数错误，会员编号不能为空！');
-    closeCurrentTab();
+    await closeCurrentTab();
     return;
   }
   user.value = await getUser(userId);
-  wallet.value = (await getWallet({ userId })) || WALLET_INIT_DATA;
+  wallet.value = (await getWallet({ userId })) || {
+    balance: 0,
+    totalExpense: 0,
+    totalRecharge: 0,
+  };
 }
 
+/** 编辑会员 */
 function handleEdit() {
   formModalApi.setData(user.value).open();
 }
 
+/** 初始化 */
 onMounted(async () => {
   await getUserDetail();
 });
@@ -63,66 +64,66 @@ onMounted(async () => {
   <Page auto-content-height>
     <FormModal @success="refreshTab" />
     <div class="flex">
-      <UserBasicInfo v-if="user" class="w-3/5" :user="user" mode="member">
+      <BasicInfo v-if="user" class="w-3/5" :user="user" mode="member">
         <template #title> 基本信息 </template>
         <template #extra>
           <Button type="primary" @click="handleEdit">
             {{ $t('common.edit') }}
           </Button>
         </template>
-      </UserBasicInfo>
+      </BasicInfo>
-      <UserAccountInfo
+      <AccountInfo
         v-if="user && wallet"
         class="ml-4 w-2/5"
         :user="user"
         :wallet="wallet"
       >
         <template #title> 账户信息 </template>
-      </UserAccountInfo>
+      </AccountInfo>
     </div>
     <div class="mt-4">
       <Card title="账户明细">
         <Tabs>
-          <TabPane tab="积分" key="UserPointList">
+          <TabPane tab="积分" key="PointList">
-            <UserPointList class="h-full" :user-id="userId" />
+            <PointList class="h-full" :user-id="userId" />
           </TabPane>
-          <TabPane tab="签到" key="UserSignList">
+          <TabPane tab="签到" key="SignList">
-            <UserSignList class="h-full" :user-id="userId" />
+            <SignList class="h-full" :user-id="userId" />
           </TabPane>
-          <TabPane tab="成长值" key="UserExperienceRecordList">
+          <TabPane tab="成长值" key="ExperienceRecordList">
-            <UserExperienceRecordList class="h-full" :user-id="userId" />
+            <ExperienceRecordList class="h-full" :user-id="userId" />
           </TabPane>
-          <TabPane tab="余额" key="UserBalanceList">
+          <TabPane tab="余额" key="BalanceList">
-            <UserBalanceList class="h-full" :wallet-id="wallet?.id" />
+            <BalanceList class="h-full" :wallet-id="wallet?.id" />
           </TabPane>
-          <TabPane tab="收货地址" key="UserAddressList">
+          <TabPane tab="收货地址" key="AddressList">
-            <UserAddressList class="h-full" :user-id="userId" />
+            <AddressList class="h-full" :user-id="userId" />
           </TabPane>
-          <TabPane tab="订单管理" key="UserOrderList">
+          <TabPane tab="订单管理" key="OrderList">
             <!-- Todo: 商城模块 -->
             <div class="h-full">
               <h1>订单管理</h1>
             </div>
           </TabPane>
-          <TabPane tab="售后管理" key="UserAfterSaleList">
+          <TabPane tab="售后管理" key="AfterSaleList">
             <!-- Todo: 商城模块 -->
             <div class="h-full">
               <h1>售后管理</h1>
             </div>
           </TabPane>
-          <TabPane tab="收藏记录" key="UserFavoriteList">
+          <TabPane tab="收藏记录" key="FavoriteList">
             <!-- Todo: 商城模块 -->
             <div class="h-full">
               <h1>收藏记录</h1>
             </div>
           </TabPane>
-          <TabPane tab="优惠劵" key="UserCouponList">
+          <TabPane tab="优惠劵" key="CouponList">
             <!-- Todo: 商城模块 -->
             <div class="h-full">
               <h1>优惠劵</h1>
             </div>
           </TabPane>
-          <TabPane tab="推广用户" key="UserBrokerageList">
+          <TabPane tab="推广用户" key="BrokerageList">
             <!-- Todo: 商城模块 -->
             <div class="h-full">
               <h1>推广用户</h1>

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

@@ -20,15 +20,11 @@ withDefaults(
 );
 
 const [Descriptions] = useDescription({
-  componentProps: {
-    bordered: false,
-    class: 'mx-4',
-  },
   schema: [
     {
       field: 'levelName',
       label: '等级',
-      content: (data) => data.levelName || '无',
+      content: (data) => data.levelName || '-',
     },
     {
       field: 'experience',

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

@@ -19,26 +19,32 @@ const [Grid] = useVbenVxeGrid({
       {
         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(
@@ -55,6 +61,7 @@ const [Grid] = useVbenVxeGrid({
       {
         field: 'createTime',
         title: '创建时间',
+        minWidth: 180,
         formatter: 'formatDateTime',
       },
     ],
@@ -73,6 +80,7 @@ const [Grid] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,

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

@@ -15,31 +15,33 @@ const [Grid] = useVbenVxeGrid({
       {
         field: 'id',
         title: '编号',
+        minWidth: 100,
       },
       {
         field: 'title',
         title: '关联业务标题',
+        minWidth: 200,
       },
       {
         field: 'price',
         title: '交易金额',
-        formatter: 'formatAmount2',
+        minWidth: 120,
+        formatter: 'formatFenToYuanAmount',
       },
       {
         field: 'balance',
         title: '钱包余额',
-        formatter: 'formatAmount2',
+        minWidth: 120,
+        formatter: 'formatFenToYuanAmount',
       },
       {
         field: 'createTime',
         title: '交易时间',
+        minWidth: 180,
         formatter: 'formatDateTime',
       },
     ],
     keepSource: true,
-    pagerConfig: {
-      pageSize: 10,
-    },
     proxyConfig: {
       ajax: {
         query: async ({ page }, formValues) => {
@@ -54,6 +56,7 @@ const [Grid] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,

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

@@ -19,10 +19,6 @@ withDefaults(
 );
 
 const [Descriptions] = useDescription({
-  componentProps: {
-    bordered: false,
-    class: 'mx-4',
-  },
   schema: [
     {
       field: 'name',
@@ -56,17 +52,17 @@ const [Descriptions] = useDescription({
     {
       field: 'birthday',
       label: '生日',
-      content: (data) => formatDate(data.birthday)?.toString() || '空',
+      content: (data) => formatDate(data.birthday)?.toString() || '-',
     },
     {
       field: 'createTime',
       label: '注册时间',
-      content: (data) => formatDate(data.createTime)?.toString() || '空',
+      content: (data) => formatDate(data.createTime)?.toString() || '-',
     },
     {
       field: 'loginDate',
       label: '最后登录时间',
-      content: (data) => formatDate(data.loginDate)?.toString() || '空',
+      content: (data) => formatDate(data.loginDate)?.toString() || '-',
     },
   ],
 });
@@ -81,10 +77,10 @@ const [Descriptions] = useDescription({
       <slot name="extra"></slot>
     </template>
     <Row v-if="mode === 'member'" :gutter="24">
-      <Col :span="4">
+      <Col :span="6">
-        <Avatar :size="140" shape="square" :src="user.avatar" />
+        <Avatar :size="180" shape="square" :src="user.avatar" />
       </Col>
-      <Col :span="20">
+      <Col :span="18">
         <Descriptions :column="2" :data="user" />
       </Col>
     </Row>

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

@@ -25,17 +25,22 @@ const [Grid] = useVbenVxeGrid({
         label: '业务类型',
         component: 'Select',
         componentProps: {
-          allowClear: true,
           options: getDictOptions(
             DICT_TYPE.MEMBER_EXPERIENCE_BIZ_TYPE,
             'number',
           ),
+          placeholder: '请选择业务类型',
+          allowClear: true,
         },
       },
       {
         fieldName: 'title',
         label: '标题',
         component: 'Input',
+        componentProps: {
+          placeholder: '请输入标题',
+          allowClear: true,
+        },
       },
       {
         fieldName: 'createDate',
@@ -53,15 +58,18 @@ const [Grid] = useVbenVxeGrid({
       {
         field: 'id',
         title: '编号',
+        minWidth: 100,
       },
       {
         field: 'createTime',
         title: '获得时间',
+        minWidth: 180,
         formatter: 'formatDateTime',
       },
       {
         field: 'experience',
         title: '经验',
+        minWidth: 100,
         slots: {
           default: ({ row }) => {
             return h(
@@ -79,22 +87,27 @@ const [Grid] = useVbenVxeGrid({
       {
         field: 'totalExperience',
         title: '总经验',
+        minWidth: 100,
       },
       {
         field: 'title',
         title: '标题',
+        minWidth: 200,
       },
       {
         field: 'description',
         title: '描述',
+        minWidth: 250,
       },
       {
         field: 'bizId',
         title: '业务编号',
+        minWidth: 120,
       },
       {
         field: 'bizType',
         title: '业务类型',
+        minWidth: 120,
         cellRender: {
           name: 'CellDict',
           props: { type: DICT_TYPE.MEMBER_EXPERIENCE_BIZ_TYPE },
@@ -102,9 +115,6 @@ const [Grid] = useVbenVxeGrid({
       },
     ],
     keepSource: true,
-    pagerConfig: {
-      pageSize: 10,
-    },
     proxyConfig: {
       ajax: {
         query: async ({ page }, formValues) => {
@@ -119,6 +129,7 @@ const [Grid] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,

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

@@ -2,11 +2,11 @@
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { MemberPointRecordApi } from '#/api/member/point/record';
 
-import { useVbenVxeGrid } from '#/adapter/vxe-table';
-import { getRecordPage } from '#/api/member/point/record';
 import { DICT_TYPE } from '@vben/constants';
 import { getDictOptions } from '@vben/hooks';
 
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getRecordPage } from '#/api/member/point/record';
 import { getRangePickerDefaultProps } from '#/utils';
 import { useGridColumns } from '#/views/member/point/record/data';
 
@@ -22,14 +22,19 @@ const [Grid] = useVbenVxeGrid({
         label: '业务类型',
         component: 'Select',
         componentProps: {
-          allowClear: true,
           options: getDictOptions(DICT_TYPE.MEMBER_POINT_BIZ_TYPE, 'number'),
+          placeholder: '请选择业务类型',
+          allowClear: true,
         },
       },
       {
         fieldName: 'title',
         label: '积分标题',
         component: 'Input',
+        componentProps: {
+          placeholder: '请输入积分标题',
+          allowClear: true,
+        },
       },
       {
         fieldName: 'createDate',
@@ -45,9 +50,6 @@ const [Grid] = useVbenVxeGrid({
   gridOptions: {
     columns: useGridColumns(),
     keepSource: true,
-    pagerConfig: {
-      pageSize: 10,
-    },
     proxyConfig: {
       ajax: {
         query: async ({ page }, formValues) => {
@@ -62,6 +64,7 @@ const [Grid] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,

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

@@ -18,6 +18,10 @@ const [Grid] = useVbenVxeGrid({
         fieldName: 'day',
         label: '签到天数',
         component: 'Input',
+        componentProps: {
+          placeholder: '请输入签到天数',
+          allowClear: true,
+        },
       },
       {
         fieldName: 'createTime',
@@ -33,9 +37,6 @@ const [Grid] = useVbenVxeGrid({
   gridOptions: {
     columns: useGridColumns(),
     keepSource: true,
-    pagerConfig: {
-      pageSize: 10,
-    },
     proxyConfig: {
       ajax: {
         query: async ({ page }, formValues) => {
@@ -50,6 +51,7 @@ const [Grid] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,

apps/web-antd/src/views/member/user/index.vue

@@ -6,11 +6,13 @@ import { ref } from 'vue';
 import { useRouter } from 'vue-router';
 
 import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { isEmpty } from '@vben/utils';
 
 import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getUserPage } from '#/api/member/user';
 import { $t } from '#/locales';
 
+import { CouponSendForm } from '../../mall/promotion/coupon/components';
 import { useGridColumns, useGridFormSchema } from './data';
 import BalanceForm from './modules/balance-form.vue';
 import Form from './modules/form.vue';
@@ -39,23 +41,16 @@ const [LevelFormModal, levelFormModalApi] = useVbenModal({
   destroyOnClose: true,
 });
 
-/** 刷新表格数据 */
+const [CouponSendFormModal, couponSendFormModalApi] = useVbenModal({
-function onRefresh() {
+  connectedComponent: CouponSendForm,
+  destroyOnClose: true,
+});
+
+/** 刷新表格 */
+function handleRefresh() {
   gridApi.query();
 }
 
-/** 设置选中 ID */
-const checkedIds = ref<number[]>([]);
-function setCheckedIds({ records }: { records: MemberUserApi.User[] }) {
-  checkedIds.value = records.map((item) => item.id!);
-}
-
-/** 发送优惠券 */
-// TODO @xingyu：这个功能没开发对，是发送优惠劵哈；
-function handleSendCoupon() {
-  formModalApi.setData(null).open();
-}
-
 /** 编辑会员 */
 function handleEdit(row: MemberUserApi.User) {
   formModalApi.setData(row).open();
@@ -76,6 +71,24 @@ function handleUpdateBalance(row: MemberUserApi.User) {
   balanceFormModalApi.setData(row).open();
 }
 
+/** 发送优惠券 */
+async function handleSendCoupon() {
+  couponSendFormModalApi
+    .setData({
+      userIds: checkedIds.value,
+    })
+    .open();
+}
+
+const checkedIds = ref<number[]>([]);
+function handleRowCheckboxChange({
+  records,
+}: {
+  records: MemberUserApi.User[];
+}) {
+  checkedIds.value = records.map((item) => item.id!);
+}
+
 /** 查看会员详情 */
 function handleViewDetail(row: MemberUserApi.User) {
   router.push({
@@ -86,17 +99,12 @@ function handleViewDetail(row: MemberUserApi.User) {
   });
 }
 
-// 表格实例
 const [Grid, gridApi] = useVbenVxeGrid({
   formOptions: {
     schema: useGridFormSchema(),
   },
   gridOptions: {
     columns: useGridColumns(),
-    checkboxConfig: {
-      highlight: true,
-      labelField: 'checkbox',
-    },
     height: 'auto',
     keepSource: true,
     proxyConfig: {
@@ -112,6 +120,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
@@ -119,8 +128,8 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
   } as VxeTableGridOptions<MemberUserApi.User>,
   gridEvents: {
-    checkboxAll: setCheckedIds,
+    checkboxAll: handleRowCheckboxChange,
-    checkboxChange: setCheckedIds,
+    checkboxChange: handleRowCheckboxChange,
   },
 });
 </script>
@@ -134,10 +143,11 @@ const [Grid, gridApi] = useVbenVxeGrid({
       />
     </template>
 
-    <FormModal @success="onRefresh" />
+    <FormModal @success="handleRefresh" />
-    <PointFormModal @success="onRefresh" />
+    <PointFormModal @success="handleRefresh" />
-    <BalanceFormModal @success="onRefresh" />
+    <BalanceFormModal @success="handleRefresh" />
-    <LevelFormModal @success="onRefresh" />
+    <LevelFormModal @success="handleRefresh" />
+    <CouponSendFormModal />
     <Grid table-title="会员列表">
       <template #toolbar-tools>
         <TableAction
@@ -146,6 +156,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               label: '发送优惠券',
               type: 'primary',
               icon: 'lucide:mouse-pointer-2',
+              disabled: isEmpty(checkedIds),
               auth: ['promotion:coupon:send'],
               onClick: handleSendCoupon,
             },

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

@@ -4,13 +4,13 @@ import type { MemberUserApi } from '#/api/member/user';
 import { ref } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
-import { formatToFraction } from '@vben/utils';
+import { fenToYuan, yuanToFen } from '@vben/utils';
 
 import { message } from 'ant-design-vue';
 
 import { useVbenForm } from '#/adapter/form';
-import { getUser, updateUser } from '#/api/member/user';
+import { getUser } from '#/api/member/user';
-import { getWallet } from '#/api/pay/wallet/balance';
+import { getWallet, updateWalletBalance } from '#/api/pay/wallet/balance';
 import { $t } from '#/locales';
 
 import { useBalanceFormSchema } from '../data';
@@ -45,9 +45,12 @@ const [Modal, modalApi] = useVbenModal({
     }
     modalApi.lock();
     // 提交表单
-    const data = (await formApi.getValues()) as MemberUserApi.User;
+    const data = await formApi.getValues();
     try {
-      await updateUser(data);
+      await updateWalletBalance({
+        userId: data.id,
+        balance: yuanToFen(data.changeBalance) * data.changeType,
+      });
       // 关闭并提示
       await modalApi.close();
       emit('success');
@@ -74,9 +77,9 @@ const [Modal, modalApi] = useVbenModal({
       const wallet = await getWallet({ userId: user.id });
       formData.value.id = user.id;
       formData.value.nickname = user.nickname || '';
-      formData.value.balance = formatToFraction(wallet.balance);
+      formData.value.balance = fenToYuan(wallet.balance);
       formData.value.changeType = 1; // 默认增加余额
-      formData.value.changeBalance = 0; // 变动余额默认0
+      formData.value.changeBalance = 0; // 变动余额默认 0
       // 设置到 values
       await formApi.setValues(formData.value);
     } finally {

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

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import type { MemberUserApi } from '#/api/member/user';
 
-import { ref } from 'vue';
+import { computed, ref } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 
@@ -15,6 +15,11 @@ import { useFormSchema } from '../data';
 
 const emit = defineEmits(['success']);
 const formData = ref<MemberUserApi.User>();
+const getTitle = computed(() => {
+  return formData.value?.id
+    ? $t('ui.actionTitle.edit', ['会员'])
+    : $t('ui.actionTitle.create', ['会员']);
+});
 
 const [Form, formApi] = useVbenForm({
   commonConfig: {
@@ -71,7 +76,7 @@ const [Modal, modalApi] = useVbenModal({
 </script>
 
 <template>
-  <Modal class="w-2/5" :title="$t('ui.actionTitle.edit', ['会员'])">
+  <Modal :title="getTitle" class="w-1/2">
     <Form class="mx-4" />
   </Modal>
 </template>

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

@@ -1,20 +1,23 @@
 <script lang="ts" setup>
 import type { MemberUserApi } from '#/api/member/user';
 
-import { ref } from 'vue';
+import { computed, ref } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 
 import { message } from 'ant-design-vue';
 
 import { useVbenForm } from '#/adapter/form';
-import { getUser, updateUser } from '#/api/member/user';
+import { getUser, updateUserLevel } from '#/api/member/user';
 import { $t } from '#/locales';
 
 import { useLevelFormSchema } from '../data';
 
 const emit = defineEmits(['success']);
 const formData = ref<MemberUserApi.User>();
+const getTitle = computed(() => {
+  return $t('ui.actionTitle.edit', ['用户等级']);
+});
 
 const [Form, formApi] = useVbenForm({
   commonConfig: {
@@ -37,9 +40,10 @@ const [Modal, modalApi] = useVbenModal({
     }
     modalApi.lock();
     // 提交表单
-    const data = (await formApi.getValues()) as MemberUserApi.User;
+    const data =
+      (await formApi.getValues()) as MemberUserApi.UserUpdateLevelReqVO;
     try {
-      await updateUser(data);
+      await updateUserLevel(data);
       // 关闭并提示
       await modalApi.close();
       emit('success');
@@ -71,7 +75,7 @@ const [Modal, modalApi] = useVbenModal({
 </script>
 
 <template>
-  <Modal class="w-1/3" :title="$t('ui.actionTitle.edit', ['用户等级'])">
+  <Modal :title="getTitle" class="w-1/2">
     <Form class="mx-4" />
   </Modal>
 </template>

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

@@ -1,20 +1,23 @@
 <script lang="ts" setup>
 import type { MemberUserApi } from '#/api/member/user';
 
-import { ref } from 'vue';
+import { computed, ref } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 
 import { message } from 'ant-design-vue';
 
 import { useVbenForm } from '#/adapter/form';
-import { getUser, updateUser } from '#/api/member/user';
+import { getUser, updateUserPoint } from '#/api/member/user';
 import { $t } from '#/locales';
 
 import { usePointFormSchema } from '../data';
 
 const emit = defineEmits(['success']);
 const formData = ref<MemberUserApi.User>();
+const getTitle = computed(() => {
+  return $t('ui.actionTitle.edit', ['用户积分']);
+});
 
 const [Form, formApi] = useVbenForm({
   commonConfig: {
@@ -37,9 +40,12 @@ const [Modal, modalApi] = useVbenModal({
     }
     modalApi.lock();
     // 提交表单
-    const data = (await formApi.getValues()) as MemberUserApi.User;
+    const data = await formApi.getValues();
     try {
-      await updateUser(data);
+      await updateUserPoint({
+        id: data.id,
+        point: data.changePoint * data.changeType,
+      });
       // 关闭并提示
       await modalApi.close();
       emit('success');
@@ -71,7 +77,7 @@ const [Modal, modalApi] = useVbenModal({
 </script>
 
 <template>
-  <Modal class="w-1/3" :title="$t('ui.actionTitle.edit', ['用户积分'])">
+  <Modal :title="getTitle" class="w-1/2">
     <Form class="mx-4" />
   </Modal>
 </template>

apps/web-antd/src/views/system/dept/data.ts

@@ -58,7 +58,6 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'InputNumber',
       componentProps: {
         min: 0,
-        controlsPosition: 'right',
         placeholder: '请输入显示顺序',
       },
       rules: 'required',

apps/web-antd/src/views/system/menu/data.ts

@@ -202,7 +202,6 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'InputNumber',
       componentProps: {
         min: 0,
-        controlsPosition: 'right',
         placeholder: '请输入显示顺序',
       },
       rules: 'required',

apps/web-antd/src/views/system/oauth2/client/data.ts

@@ -76,7 +76,6 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         placeholder: '请输入访问令牌的有效期，单位：秒',
         min: 0,
-        controlsPosition: 'right',
       },
       rules: 'required',
     },
@@ -87,7 +86,6 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         placeholder: '请输入刷新令牌的有效期，单位：秒',
         min: 0,
-        controlsPosition: 'right',
       },
       rules: 'required',
     },

apps/web-antd/src/views/system/role/data.ts

@@ -40,7 +40,6 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'InputNumber',
       componentProps: {
         min: 0,
-        controlsPosition: 'right',
         placeholder: '请输入显示顺序',
       },
       rules: 'required',

apps/web-antd/src/views/system/user/data.ts

@@ -79,11 +79,17 @@ export function useFormSchema(): VbenFormSchema[] {
       label: '邮箱',
       component: 'Input',
       rules: z.string().email('邮箱格式不正确').or(z.literal('')).optional(),
+      componentProps: {
+        placeholder: '请输入邮箱',
+      },
     },
     {
       fieldName: 'mobile',
       label: '手机号码',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入手机号码',
+      },
     },
     {
       fieldName: 'sex',

apps/web-ele/src/api/mall/promotion/coupon/coupon.ts

@@ -40,9 +40,9 @@ export namespace MallCouponApi {
   }
 
   /** 发送优惠券 */
-  export interface SendCoupon {
+  export interface CouponSendReqVO {
     /** 优惠券编号 */
-    couponId: number;
+    templateId: number;
     /** 用户编号数组 */
     userIds: number[];
   }
@@ -62,6 +62,6 @@ export function getCouponPage(params: PageParam) {
 }
 
 /** 发送优惠券 */
-export function sendCoupon(data: MallCouponApi.SendCoupon) {
+export function sendCoupon(data: MallCouponApi.CouponSendReqVO) {
   return requestClient.post('/promotion/coupon/send', data);
 }

apps/web-ele/src/api/member/level/index.ts

@@ -11,6 +11,7 @@ export namespace MemberLevelApi {
     icon: string;
     bgUrl: string;
     status: number;
+    createTime?: Date;
   }
 }
 

apps/web-ele/src/api/member/user/index.ts

@@ -20,20 +20,20 @@ export namespace MemberUserApi {
     status: number;
     areaId?: number;
     areaName?: string;
-    levelName: null | string;
+    levelName: string;
-    point?: null | number;
+    point?: number;
-    totalPoint?: null | number;
+    totalPoint?: number;
-    experience?: null | number;
+    experience?: number;
   }
 
   /** 会员用户等级更新信息 */
-  export interface UserLevelUpdate {
+  export interface UserUpdateLevelReqVO {
     id: number;
     levelId: number;
   }
 
   /** 会员用户积分更新信息 */
-  export interface UserPointUpdate {
+  export interface UserPointUpdateReqVO {
     id: number;
     point: number;
   }
@@ -60,11 +60,11 @@ export function updateUser(data: MemberUserApi.User) {
 }
 
 /** 修改会员用户等级 */
-export function updateUserLevel(data: MemberUserApi.UserLevelUpdate) {
+export function updateUserLevel(data: MemberUserApi.UserUpdateLevelReqVO) {
   return requestClient.put('/member/user/update-level', data);
 }
 
 /** 修改会员用户积分 */
-export function updateUserPoint(data: MemberUserApi.UserPointUpdate) {
+export function updateUserPoint(data: MemberUserApi.UserPointUpdateReqVO) {
   return requestClient.put('/member/user/update-point', data);
 }

apps/web-ele/src/api/pay/wallet/balance/index.ts

@@ -28,6 +28,12 @@ export namespace PayWalletApi {
     totalRecharge?: number;
     freezePrice?: number;
   }
+
+  /** 钱包修改余额 */
+  export interface PayWalletUpdateBalanceReqVO {
+    userId: number;
+    balance: number;
+  }
 }
 
 /** 查询用户钱包详情 */
@@ -48,6 +54,8 @@ export function getWalletPage(params: PayWalletApi.WalletPageReqVO) {
 }
 
 /** 修改会员钱包余额 */
-export function updateWalletBalance(data: PayWalletApi.Wallet) {
+export function updateWalletBalance(
+  data: PayWalletApi.PayWalletUpdateBalanceReqVO,
+) {
   return requestClient.put('/pay/wallet/update-balance', data);
 }

apps/web-ele/src/router/routes/modules/member.ts

@@ -3,11 +3,12 @@ import type { RouteRecordRaw } from 'vue-router';
 const routes: RouteRecordRaw[] = [
   {
     path: '/member/user/detail',
-    component: () => import('#/views/member/user/modules/detail.vue'),
+    component: () => import('#/views/member/user/detail/index.vue'),
     name: 'MemberUserDetail',
     meta: {
       title: '会员详情',
       icon: 'lucide:user',
+      activePath: '/member/user',
       hideInMenu: true,
     },
   },

apps/web-ele/src/views/infra/fileConfig/data.ts

@@ -83,8 +83,9 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'InputNumber',
       componentProps: {
         min: 0,
-        controlsPosition: 'right',
         placeholder: '请输入主机端口',
+        controlsPosition: 'right',
+        class: '!w-full',
       },
       rules: 'required',
       dependencies: {

apps/web-ele/src/views/mall/promotion/coupon/components/data.ts

@@ -0,0 +1,64 @@
+import type { VbenFormSchema } from '#/adapter/form';
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+import {
+  discountFormat,
+  remainedCountFormat,
+  usePriceFormat,
+  validityTypeFormat,
+} from '../formatter';
+
+/** 搜索表单的 schema */
+export function useFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      component: 'Input',
+      fieldName: 'name',
+      label: '优惠券名称',
+      componentProps: {
+        placeholder: '请输入优惠券名称',
+        clearable: true,
+      },
+    },
+  ];
+}
+
+/** 表格列配置 */
+export function useGridColumns(): VxeGridProps['columns'] {
+  return [
+    {
+      title: '优惠券名称',
+      field: 'name',
+      minWidth: 120,
+    },
+    {
+      title: '优惠金额 / 折扣',
+      field: 'discount',
+      minWidth: 120,
+      formatter: ({ row }) => discountFormat(row),
+    },
+    {
+      title: '最低消费',
+      field: 'usePrice',
+      minWidth: 100,
+      formatter: ({ row }) => usePriceFormat(row),
+    },
+    {
+      title: '有效期限',
+      field: 'validityType',
+      minWidth: 140,
+      formatter: ({ row }) => validityTypeFormat(row),
+    },
+    {
+      title: '剩余数量',
+      minWidth: 100,
+      formatter: ({ row }) => remainedCountFormat(row),
+    },
+    {
+      title: '操作',
+      width: 100,
+      fixed: 'right',
+      slots: { default: 'actions' },
+    },
+  ];
+}

apps/web-ele/src/views/mall/promotion/coupon/components/index.ts

@@ -0,0 +1,2 @@
+export * from './data';
+export { default as CouponSendForm } from './send-form.vue';

apps/web-ele/src/views/mall/promotion/coupon/components/send-form.vue

@@ -0,0 +1,86 @@
+<script lang="ts" setup>
+import type { VxeGridProps } from '#/adapter/vxe-table';
+import type { MallCouponTemplateApi } from '#/api/mall/promotion/coupon/couponTemplate';
+
+import { useVbenModal } from '@vben/common-ui';
+import { CouponTemplateTakeTypeEnum } from '@vben/constants';
+
+import { ElMessage } from 'element-plus';
+
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { sendCoupon } from '#/api/mall/promotion/coupon/coupon';
+import { getCouponTemplatePage } from '#/api/mall/promotion/coupon/couponTemplate';
+
+import { useFormSchema, useGridColumns } from './data';
+
+/** 发送优惠券 */
+async function handleSendCoupon(row: MallCouponTemplateApi.CouponTemplate) {
+  modalApi.lock();
+  try {
+    await sendCoupon({
+      templateId: row.id,
+      userIds: modalApi.getData().userIds,
+    });
+    ElMessage.success('发送成功');
+    await modalApi.close();
+  } finally {
+    modalApi.unlock();
+  }
+}
+
+const [Grid] = useVbenVxeGrid({
+  formOptions: {
+    schema: useFormSchema(),
+  },
+  gridOptions: {
+    columns: useGridColumns(),
+    height: 500,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) => {
+          return await getCouponTemplatePage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+            canTakeTypes: [CouponTemplateTakeTypeEnum.ADMIN.type],
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeGridProps<MallCouponTemplateApi.CouponTemplate>,
+});
+
+const [Modal, modalApi] = useVbenModal({
+  showCancelButton: false,
+  showConfirmButton: false,
+});
+</script>
+
+<template>
+  <Modal title="发送优惠劵" class="w-1/2">
+    <Grid>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '发送',
+              type: 'primary',
+              link: true,
+              auth: ['promotion:coupon:send'],
+              onClick: () => handleSendCoupon(row),
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </Modal>
+</template>

apps/web-ele/src/views/mall/trade/config/index.vue

@@ -60,7 +60,6 @@ onMounted(() => {
 
 const [Form, formApi] = useVbenForm({
   wrapperClass: 'grid-cols-1',
-  actionWrapperClass: 'text-center',
   handleSubmit: onSubmit,
   layout: 'horizontal',
   resetButtonOptions: {

apps/web-ele/src/views/member/config/data.ts

@@ -0,0 +1,52 @@
+import type { VbenFormSchema } from '#/adapter/form';
+
+export const schema: VbenFormSchema[] = [
+  {
+    component: 'Input',
+    fieldName: 'id',
+    dependencies: {
+      triggerFields: [''],
+      show: () => false,
+    },
+  },
+  {
+    component: 'Switch',
+    fieldName: 'pointTradeDeductEnable',
+    label: '积分抵扣',
+    help: '下单积分是否抵用订单金额',
+  },
+  {
+    component: 'InputNumber',
+    fieldName: 'pointTradeDeductUnitPrice',
+    label: '积分抵扣',
+    help: '积分抵用比例(1 积分抵多少金额)，单位：元',
+    componentProps: {
+      min: 0,
+      precision: 2,
+      class: 'w-full',
+      placeholder: '请输入积分抵扣单价',
+    },
+  },
+  {
+    component: 'InputNumber',
+    fieldName: 'pointTradeDeductMaxPrice',
+    label: '积分抵扣最大值',
+    help: '单次下单积分使用上限，0 不限制',
+    componentProps: {
+      min: 0,
+      class: 'w-full',
+      placeholder: '请输入积分抵扣最大值',
+    },
+  },
+  {
+    component: 'InputNumber',
+    fieldName: 'pointTradeGivePoint',
+    label: '1 元赠送多少分',
+    help: '下单支付金额按比例赠送积分（实际支付 1 元赠送多少积分）',
+    componentProps: {
+      min: 0,
+      class: 'w-full',
+      placeholder: '请输入赠送积分比例',
+    },
+  },
+];

apps/web-ele/src/views/member/config/index.vue

@@ -4,6 +4,7 @@ import type { MemberConfigApi } from '#/api/member/config';
 import { onMounted, ref } from 'vue';
 
 import { Page } from '@vben/common-ui';
+import { fenToYuan, yuanToFen } from '@vben/utils';
 
 import { ElCard, ElMessage } from 'element-plus';
 
@@ -11,95 +12,47 @@ import { useVbenForm } from '#/adapter/form';
 import { getConfig, saveConfig } from '#/api/member/config';
 import { $t } from '#/locales';
 
-const emit = defineEmits(['success']);
+import { schema } from './data';
+
 const formData = ref<MemberConfigApi.Config>();
 
 const [Form, formApi] = useVbenForm({
   commonConfig: {
-    // 所有表单项
+    labelWidth: 120,
-    labelClass: 'w-2/6',
   },
   layout: 'horizontal',
-  wrapperClass: 'grid-cols-1',
+  schema,
-  actionWrapperClass: 'text-center',
+  handleSubmit,
-  schema: [
-    {
-      component: 'Input',
-      fieldName: 'id',
-      dependencies: {
-        triggerFields: [''],
-        show: () => false,
-      },
-    },
-    {
-      component: 'Switch',
-      fieldName: 'pointTradeDeductEnable',
-      label: '积分抵扣',
-      help: '开启后，用户可以积分抵扣',
-    },
-    {
-      component: 'InputNumber',
-      fieldName: 'pointTradeDeductUnitPrice',
-      label: '积分抵扣单价',
-      help: '用户每消费1元，可以抵扣多少积分',
-      componentProps: {
-        min: 0,
-        precision: 2,
-        class: 'w-full',
-      },
-    },
-    {
-      component: 'InputNumber',
-      fieldName: 'pointTradeDeductMaxPrice',
-      label: '积分抵扣最大值',
-      help: '单次下单积分使用上限，0 不限制',
-      componentProps: {
-        min: 0,
-        class: 'w-full',
-      },
-    },
-    {
-      component: 'InputNumber',
-      fieldName: 'pointTradeGivePoint',
-      label: '1 元赠送多少分',
-      help: '下单支付金额按比例赠送积分（实际支付 1 元赠送多少积分）',
-      componentProps: {
-        min: 0,
-        class: 'w-full',
-      },
-    },
-  ],
-  // 提交函数
-  handleSubmit: onSubmit,
 });
 
-async function onSubmit() {
+/** 提交表单 */
+async function handleSubmit() {
   const { valid } = await formApi.validate();
   if (!valid) {
     return;
   }
   // 提交表单
   const data = (await formApi.getValues()) as MemberConfigApi.Config;
-  formApi.setState({ commonConfig: { disabled: true } });
+  // 转换金额单位
-  try {
+  data.pointTradeDeductUnitPrice = yuanToFen(data.pointTradeDeductUnitPrice);
-    await saveConfig(data);
+  await saveConfig(data);
-    // 关闭并提示
+  // 关闭并提示
-    emit('success');
+  ElMessage.success($t('ui.actionMessage.operationSuccess'));
-    ElMessage.success($t('ui.actionMessage.operationSuccess'));
-  } finally {
-    formApi.setState({ commonConfig: { disabled: false } });
-  }
 }
 
+/** 获取配置 */
 async function getConfigInfo() {
-  try {
+  const res = await getConfig();
-    const res = await getConfig();
+  formData.value = res;
-    formData.value = res;
+  // 转换金额单位
-  } catch (error) {
+  res.pointTradeDeductUnitPrice = Number.parseFloat(
-    console.error(error);
+    fenToYuan(res.pointTradeDeductUnitPrice),
-  }
+  );
+  // 设置到 values
+  await formApi.setValues(res);
 }
 
+/** 初始化 */
 onMounted(() => {
   getConfigInfo();
 });

apps/web-ele/src/views/member/group/data.ts

@@ -10,17 +10,18 @@ import { z } from '#/adapter/form';
 export function useFormSchema(): VbenFormSchema[] {
   return [
     {
-      component: 'Input',
       fieldName: 'id',
+      component: 'Input',
       dependencies: {
         triggerFields: [''],
         show: () => false,
       },
     },
     {
-      component: 'Input',
       fieldName: 'name',
       label: '分组名称',
+      component: 'Input',
+      rules: 'required',
     },
     {
       fieldName: 'status',
@@ -33,6 +34,14 @@ export function useFormSchema(): VbenFormSchema[] {
       },
       rules: z.number().default(CommonStatusEnum.ENABLE),
     },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+      },
+    },
   ];
 }
 
@@ -43,14 +52,28 @@ export function useGridFormSchema(): VbenFormSchema[] {
       fieldName: 'name',
       label: '分组名称',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入分组名称',
+        allowClear: true,
+      },
     },
     {
       fieldName: 'status',
       label: '状态',
       component: 'Select',
       componentProps: {
-        clearable: true,
         options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
+        placeholder: '请选择状态',
+        allowClear: true,
+      },
+    },
+    {
+      fieldName: 'createTime',
+      label: '创建时间',
+      component: 'RangePicker',
+      componentProps: {
+        placeholder: ['开始日期', '结束日期'],
+        allowClear: true,
       },
     },
   ];
@@ -62,14 +85,23 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'id',
       title: '编号',
+      minWidth: 100,
     },
     {
       field: 'name',
       title: '分组名称',
+      minWidth: 150,
+    },
+    {
+      field: 'remark',
+      title: '备注',
+      minWidth: 200,
+      showOverflow: 'tooltip',
     },
     {
       field: 'status',
       title: '状态',
+      minWidth: 100,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.COMMON_STATUS },
@@ -78,6 +110,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'createTime',
       title: '创建时间',
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {

apps/web-ele/src/views/member/group/index.vue

@@ -19,7 +19,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function onRefresh() {
+function handleRefresh() {
   gridApi.query();
 }
 
@@ -39,9 +39,9 @@ async function handleDelete(row: MemberGroupApi.Group) {
     text: $t('ui.actionMessage.deleting', [row.name]),
   });
   try {
-    await deleteGroup(row.id as number);
+    await deleteGroup(row.id!);
     ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
-    onRefresh();
+    handleRefresh();
   } finally {
     loadingInstance.close();
   }
@@ -68,6 +68,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
@@ -79,7 +80,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="onRefresh" />
+    <FormModal @success="handleRefresh" />
     <Grid table-title="分组列表">
       <template #toolbar-tools>
         <TableAction

apps/web-ele/src/views/member/group/modules/form.vue

@@ -17,8 +17,8 @@ const emit = defineEmits(['success']);
 const formData = ref<MemberGroupApi.Group>();
 const getTitle = computed(() => {
   return formData.value?.id
-    ? $t('ui.actionTitle.edit', ['会员分组'])
+    ? $t('ui.actionTitle.edit', ['分组'])
-    : $t('ui.actionTitle.create', ['会员分组']);
+    : $t('ui.actionTitle.create', ['分组']);
 });
 
 const [Form, formApi] = useVbenForm({
@@ -76,7 +76,7 @@ const [Modal, modalApi] = useVbenModal({
 </script>
 
 <template>
-  <Modal class="w-2/5" :title="getTitle">
+  <Modal :title="getTitle" class="w-1/2">
     <Form class="mx-4" />
   </Modal>
 </template>

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' },
     },

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({
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="onRefresh" />
+    <DocAlert
+      title="会员等级、积分、签到"
+      url="https://doc.iocoder.cn/member/level/"
+    />
+
+    <FormModal @success="handleRefresh" />
     <Grid table-title="等级列表">
       <template #toolbar-tools>
         <TableAction

apps/web-ele/src/views/member/level/modules/form.vue

@@ -27,7 +27,7 @@ const [Form, formApi] = useVbenForm({
       class: 'w-full',
     },
     formItemClass: 'col-span-2',
-    labelWidth: 80,
+    labelWidth: 110,
   },
   layout: 'horizontal',
   schema: useFormSchema(),
@@ -76,7 +76,7 @@ const [Modal, modalApi] = useVbenModal({
 </script>
 
 <template>
-  <Modal class="w-2/5" :title="getTitle">
+  <Modal :title="getTitle" class="w-1/2">
     <Form class="mx-4" />
   </Modal>
 </template>

apps/web-ele/src/views/member/point/record/data.ts

@@ -3,11 +3,11 @@ import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 
 import { h } from 'vue';
 
-import { ElTag } from 'element-plus';
-
 import { DICT_TYPE } from '@vben/constants';
 import { getDictOptions } from '@vben/hooks';
 
+import { ElTag } from 'element-plus';
+
 import { getRangePickerDefaultProps } from '#/utils';
 
 /** 列表的搜索表单 */
@@ -17,12 +17,17 @@ export function useGridFormSchema(): VbenFormSchema[] {
       fieldName: 'nickname',
       label: '用户',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入用户昵称',
+        clearable: true,
+      },
     },
     {
       fieldName: 'bizType',
       label: '业务类型',
       component: 'Select',
       componentProps: {
+        placeholder: '请选择业务类型',
         clearable: true,
         options: getDictOptions(DICT_TYPE.MEMBER_POINT_BIZ_TYPE, 'number'),
       },
@@ -31,6 +36,10 @@ export function useGridFormSchema(): VbenFormSchema[] {
       fieldName: 'title',
       label: '积分标题',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入积分标题',
+        clearable: true,
+      },
     },
     {
       fieldName: 'createDate',
@@ -50,26 +59,29 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'id',
       title: '编号',
+      minWidth: 100,
     },
     {
       field: 'createTime',
       title: '获得时间',
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {
       field: 'nickname',
       title: '用户',
+      minWidth: 150,
     },
     {
       field: 'point',
       title: '获得积分',
+      minWidth: 120,
       slots: {
         default: ({ row }) => {
           return h(
             ElTag,
             {
-              class: 'mr-1',
+              type: row.point > 0 ? 'primary' : 'danger',
-              color: row.point > 0 ? 'blue' : 'red',
             },
             () => (row.point > 0 ? `+${row.point}` : row.point),
           );
@@ -79,22 +91,27 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'totalPoint',
       title: '总积分',
+      minWidth: 100,
     },
     {
       field: 'title',
       title: '标题',
+      minWidth: 200,
     },
     {
       field: 'description',
       title: '描述',
+      minWidth: 200,
     },
     {
       field: 'bizId',
       title: '业务编码',
+      minWidth: 120,
     },
     {
       field: 'bizType',
       title: '业务类型',
+      minWidth: 120,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.MEMBER_POINT_BIZ_TYPE },

apps/web-ele/src/views/member/point/record/index.vue

@@ -2,7 +2,7 @@
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { MemberPointRecordApi } from '#/api/member/point/record';
 
-import { Page } from '@vben/common-ui';
+import { DocAlert, Page } from '@vben/common-ui';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getRecordPage } from '#/api/member/point/record';
@@ -30,6 +30,7 @@ const [Grid] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
@@ -41,6 +42,11 @@ const [Grid] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
+    <DocAlert
+      title="会员等级、积分、签到"
+      url="https://doc.iocoder.cn/member/level/"
+    />
+
     <Grid table-title="积分记录列表" />
   </Page>
 </template>

apps/web-ele/src/views/member/signin/config/data.ts

@@ -26,7 +26,11 @@ export function useFormSchema(): VbenFormSchema[] {
         min: 1,
         max: 7,
         precision: 0,
+        placeholder: '请输入签到天数',
+        controlsPosition: 'right',
+        class: '!w-full',
       },
+      rules: z.number().min(1).max(7, '签到天数必须在 1-7 之间'),
     },
     {
       component: 'InputNumber',
@@ -35,7 +39,11 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         min: 0,
         precision: 0,
+        placeholder: '请输入获得积分',
+        controlsPosition: 'right',
+        class: '!w-full',
       },
+      rules: z.number().min(0, '获得积分不能小于 0'),
     },
     {
       component: 'InputNumber',
@@ -44,7 +52,11 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         min: 0,
         precision: 0,
+        placeholder: '请输入奖励经验',
+        controlsPosition: 'right',
+        class: '!w-full',
       },
+      rules: z.number().min(0, '奖励经验不能小于 0'),
     },
     {
       fieldName: 'status',
@@ -63,39 +75,34 @@ export function useFormSchema(): VbenFormSchema[] {
 /** 列表的字段 */
 export function useGridColumns(): VxeTableGridOptions['columns'] {
   return [
-    {
-      field: 'id',
-      title: '编号',
-    },
     {
       field: 'day',
       title: '签到天数',
+      minWidth: 120,
       formatter: ({ cellValue }) => ['第', cellValue, '天'].join(' '),
     },
     {
       field: 'point',
       title: '获得积分',
+      minWidth: 120,
     },
     {
       field: 'experience',
       title: '奖励经验',
+      minWidth: 120,
     },
     {
       field: 'status',
       title: '状态',
+      minWidth: 100,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.COMMON_STATUS },
       },
     },
-    {
-      field: 'createTime',
-      title: '创建时间',
-      formatter: 'formatDateTime',
-    },
     {
       title: '操作',
-      width: 130,
+      width: 150,
       fixed: 'right',
       slots: { default: 'actions' },
     },

apps/web-ele/src/views/member/signin/config/index.vue

@@ -2,7 +2,7 @@
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { MemberSignInConfigApi } from '#/api/member/signin/config';
 
-import { Page, useVbenModal } from '@vben/common-ui';
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
 
 import { ElLoading, ElMessage } from 'element-plus';
 
@@ -22,7 +22,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function onRefresh() {
+function handleRefresh() {
   gridApi.query();
 }
 
@@ -44,7 +44,7 @@ async function handleDelete(row: MemberSignInConfigApi.SignInConfig) {
   try {
     await deleteSignInConfig(row.id as number);
     ElMessage.success($t('ui.actionMessage.deleteSuccess'));
-    onRefresh();
+    handleRefresh();
   } finally {
     loadingInstance.close();
   }
@@ -67,6 +67,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
@@ -78,7 +79,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="onRefresh" />
+    <template #doc>
+      <DocAlert
+        title="会员等级、积分、签到"
+        url="https://doc.iocoder.cn/member/level/"
+      />
+    </template>
+
+    <FormModal @success="handleRefresh" />
     <Grid table-title="签到配置列表">
       <template #toolbar-tools>
         <TableAction
@@ -111,7 +119,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               icon: ACTION_ICON.DELETE,
               auth: ['point:sign-in-config:delete'],
               popConfirm: {
-                title: $t('ui.actionMessage.deleteConfirm', [row.name]),
+                title: $t('ui.actionMessage.deleteConfirm', [row.day]),
                 confirm: handleDelete.bind(null, row),
               },
             },

apps/web-ele/src/views/member/signin/config/modules/form.vue

@@ -31,7 +31,7 @@ const [Form, formApi] = useVbenForm({
       class: 'w-full',
     },
     formItemClass: 'col-span-2',
-    labelWidth: 80,
+    labelWidth: 90,
   },
   layout: 'horizontal',
   schema: useFormSchema(),

apps/web-ele/src/views/member/signin/record/data.ts

@@ -14,11 +14,19 @@ export function useGridFormSchema(): VbenFormSchema[] {
       fieldName: 'nickname',
       label: '签到用户',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入签到用户',
+        clearable: true,
+      },
     },
     {
       fieldName: 'day',
       label: '签到天数',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入签到天数',
+        clearable: true,
+      },
     },
     {
       fieldName: 'createTime',
@@ -38,26 +46,29 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'id',
       title: '编号',
+      minWidth: 100,
     },
     {
       field: 'nickname',
       title: '签到用户',
+      minWidth: 150,
     },
     {
       field: 'day',
       title: '签到天数',
+      minWidth: 120,
       formatter: ({ cellValue }) => ['第', cellValue, '天'].join(' '),
     },
     {
       field: 'point',
       title: '获得积分',
+      minWidth: 120,
       slots: {
         default: ({ row }) => {
           return h(
             ElTag,
             {
-              class: 'mr-5px',
+              type: row.point > 0 ? 'primary' : 'danger',
-              color: row.point > 0 ? 'blue' : 'red',
             },
             () => (row.point > 0 ? `+${row.point}` : row.point),
           );
@@ -67,6 +78,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'createTime',
       title: '签到时间',
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
   ];

apps/web-ele/src/views/member/signin/record/index.vue

@@ -2,7 +2,7 @@
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { MemberSignInRecordApi } from '#/api/member/signin/record';
 
-import { Page } from '@vben/common-ui';
+import { DocAlert, Page } from '@vben/common-ui';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getSignInRecordPage } from '#/api/member/signin/record';
@@ -30,6 +30,7 @@ const [Grid] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
@@ -41,6 +42,12 @@ const [Grid] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="会员等级、积分、签到"
+        url="https://doc.iocoder.cn/member/level/"
+      />
+    </template>
     <Grid table-title="签到记录列表" />
   </Page>
 </template>

apps/web-ele/src/views/member/tag/data.ts

@@ -18,6 +18,9 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'Input',
       fieldName: 'name',
       label: '标签名称',
+      componentProps: {
+        placeholder: '请输入标签名称',
+      },
       rules: 'required',
     },
   ];
@@ -30,6 +33,10 @@ export function useGridFormSchema(): VbenFormSchema[] {
       fieldName: 'name',
       label: '标签名称',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入标签名称',
+        clearable: true,
+      },
     },
     {
       fieldName: 'createTime',
@@ -37,6 +44,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       component: 'RangePicker',
       componentProps: {
         ...getRangePickerDefaultProps(),
+        placeholder: ['开始日期', '结束日期'],
       },
     },
   ];
@@ -48,14 +56,17 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'id',
       title: '编号',
+      minWidth: 100,
     },
     {
       field: 'name',
       title: '标签名称',
+      minWidth: 200,
     },
     {
       field: 'createTime',
       title: '创建时间',
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {

apps/web-ele/src/views/member/tag/index.vue

@@ -19,7 +19,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function onRefresh() {
+function handleRefresh() {
   gridApi.query();
 }
 
@@ -41,7 +41,7 @@ async function handleDelete(row: MemberTagApi.Tag) {
   try {
     await deleteMemberTag(row.id as number);
     ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
-    onRefresh();
+    handleRefresh();
   } finally {
     loadingInstance.close();
   }
@@ -68,6 +68,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
@@ -85,7 +86,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
         url="https://doc.iocoder.cn/member/user/"
       />
     </template>
-    <FormModal @success="onRefresh" />
+    <FormModal @success="handleRefresh" />
     <Grid table-title="会员标签列表">
       <template #toolbar-tools>
         <TableAction

apps/web-ele/src/views/member/user/data.ts

@@ -16,21 +16,21 @@ import { getSimpleTagList } from '#/api/member/tag';
 import { getAreaTree } from '#/api/system/area';
 import { getRangePickerDefaultProps } from '#/utils';
 
-/** 修改的表单 */
+/** 新增/修改的表单 */
 export function useFormSchema(): VbenFormSchema[] {
   return [
     {
-      component: 'Input',
       fieldName: 'id',
+      component: 'Input',
       dependencies: {
         triggerFields: [''],
         show: () => false,
       },
     },
     {
-      component: 'Input',
       fieldName: 'mobile',
       label: '手机号',
+      component: 'Input',
       rules: 'required',
     },
     {
@@ -45,19 +45,25 @@ export function useFormSchema(): VbenFormSchema[] {
       rules: z.number().default(CommonStatusEnum.ENABLE).optional(),
     },
     {
-      component: 'Input',
       fieldName: 'nickname',
       label: '用户昵称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入用户昵称',
+      },
     },
     {
-      component: 'ImageUpload',
       fieldName: 'avatar',
       label: '头像',
+      component: 'ImageUpload',
     },
     {
-      component: 'Input',
       fieldName: 'name',
       label: '真实名字',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入真实名字',
+      },
     },
     {
       fieldName: 'sex',
@@ -70,49 +76,57 @@ export function useFormSchema(): VbenFormSchema[] {
       },
     },
     {
-      component: 'DatePicker',
       fieldName: 'birthday',
       label: '出生日期',
+      component: 'DatePicker',
       componentProps: {
         format: 'YYYY-MM-DD',
+        valueFormat: 'x',
+        placeholder: '请选择出生日期',
       },
     },
     {
-      component: 'ApiTreeSelect',
       fieldName: 'areaId',
       label: '所在地',
+      component: 'ApiTreeSelect',
       componentProps: {
         api: () => getAreaTree(),
         labelField: 'name',
         valueField: 'id',
         childrenField: 'children',
+        placeholder: '请选择所在地',
       },
     },
     {
-      component: 'ApiSelect',
       fieldName: 'tagIds',
       label: '用户标签',
+      component: 'ApiSelect',
       componentProps: {
         api: () => getSimpleTagList(),
         labelField: 'name',
         valueField: 'id',
-        mode: 'multiple',
+        multiple: true,
+        placeholder: '请选择用户标签',
       },
     },
     {
-      component: 'ApiSelect',
       fieldName: 'groupId',
       label: '用户分组',
+      component: 'ApiSelect',
       componentProps: {
         api: () => getSimpleGroupList(),
         labelField: 'name',
         valueField: 'id',
+        placeholder: '请选择用户分组',
       },
     },
     {
-      component: 'Textarea',
       fieldName: 'mark',
       label: '会员备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入会员备注',
+      },
     },
   ];
 }
@@ -124,11 +138,19 @@ export function useGridFormSchema(): VbenFormSchema[] {
       fieldName: 'nickname',
       label: '用户昵称',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入用户昵称',
+        clearable: true,
+      },
     },
     {
       fieldName: 'mobile',
       label: '手机号',
       component: 'Input',
+      componentProps: {
+        placeholder: '请输入手机号',
+        clearable: true,
+      },
     },
     {
       fieldName: 'loginDate',
@@ -136,6 +158,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       component: 'RangePicker',
       componentProps: {
         ...getRangePickerDefaultProps(),
+        clearable: true,
       },
     },
     {
@@ -144,6 +167,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       component: 'RangePicker',
       componentProps: {
         ...getRangePickerDefaultProps(),
+        clearable: true,
       },
     },
     {
@@ -154,7 +178,9 @@ export function useGridFormSchema(): VbenFormSchema[] {
         api: () => getSimpleTagList(),
         labelField: 'name',
         valueField: 'id',
-        mode: 'multiple',
+        multiple: true,
+        placeholder: '请选择用户标签',
+        clearable: true,
       },
     },
     {
@@ -165,6 +191,8 @@ export function useGridFormSchema(): VbenFormSchema[] {
         api: () => getSimpleLevelList(),
         labelField: 'name',
         valueField: 'id',
+        placeholder: '请选择用户等级',
+        clearable: true,
       },
     },
     {
@@ -175,6 +203,8 @@ export function useGridFormSchema(): VbenFormSchema[] {
         api: () => getSimpleGroupList(),
         labelField: 'name',
         valueField: 'id',
+        placeholder: '请选择用户分组',
+        clearable: true,
       },
     },
   ];
@@ -190,38 +220,40 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'id',
       title: '用户编号',
+      minWidth: 100,
     },
     {
       field: 'avatar',
       title: '头像',
-      slots: {
+      minWidth: 80,
-        default: ({ row }) => {
+      cellRender: {
-          return h('img', {
+        name: 'CellImage',
-            src: row.avatar,
-            style: { width: '40px' },
-          });
-        },
       },
     },
     {
       field: 'mobile',
       title: '手机号',
+      minWidth: 120,
     },
     {
       field: 'nickname',
       title: '昵称',
+      minWidth: 120,
     },
     {
       field: 'levelName',
       title: '等级',
+      minWidth: 100,
     },
     {
       field: 'groupName',
       title: '分组',
+      minWidth: 100,
     },
     {
       field: 'tagNames',
       title: '用户标签',
+      minWidth: 150,
       slots: {
         default: ({ row }) => {
           return row.tagNames?.map((tagName: string, index: number) => {
@@ -230,7 +262,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
               {
                 key: index,
                 class: 'mr-1',
-                color: 'blue',
+                type: 'primary',
               },
               () => tagName,
             );
@@ -241,10 +273,12 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'point',
       title: '积分',
+      minWidth: 80,
     },
     {
       field: 'status',
       title: '状态',
+      minWidth: 80,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.COMMON_STATUS },
@@ -253,11 +287,13 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'loginDate',
       title: '登录时间',
+      minWidth: 160,
       formatter: 'formatDateTime',
     },
     {
       field: 'createTime',
       title: '注册时间',
+      minWidth: 160,
       formatter: 'formatDateTime',
     },
     {
@@ -270,38 +306,43 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
 }
 
 /** 修改用户等级 */
-export function useLeavelFormSchema(): VbenFormSchema[] {
+export function useLevelFormSchema(): VbenFormSchema[] {
   return [
     {
-      component: 'Input',
       fieldName: 'id',
       label: '用户编号',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      component: 'Input',
       fieldName: 'nickname',
       label: '用户昵称',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      fieldName: 'point',
+      fieldName: 'levelId',
       label: '用户等级',
       component: 'ApiSelect',
       componentProps: {
         api: () => getSimpleLevelList(),
         labelField: 'name',
         valueField: 'id',
+        placeholder: '请选择用户等级',
+        clearable: true,
       },
     },
     {
-      component: 'Textarea',
       fieldName: 'reason',
       label: '修改原因',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入修改原因',
+      },
       rules: 'required',
     },
   ];
@@ -311,33 +352,33 @@ export function useLeavelFormSchema(): VbenFormSchema[] {
 export function useBalanceFormSchema(): VbenFormSchema[] {
   return [
     {
-      component: 'Input',
       fieldName: 'id',
       label: '用户编号',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      component: 'Input',
       fieldName: 'nickname',
       label: '用户昵称',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      component: 'Input',
       fieldName: 'balance',
       label: '变动前余额(元)',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      component: 'RadioGroup',
       fieldName: 'changeType',
       label: '变动类型',
+      component: 'RadioGroup',
       componentProps: {
         options: [
           { label: '增加', value: 1 },
@@ -349,23 +390,26 @@ export function useBalanceFormSchema(): VbenFormSchema[] {
       defaultValue: 1,
     },
     {
-      component: 'InputNumber',
       fieldName: 'changeBalance',
       label: '变动余额(元)',
+      component: 'InputNumber',
       rules: 'required',
       componentProps: {
         min: 0,
         precision: 2,
         step: 0.1,
+        placeholder: '请输入变动余额',
+        controlsPosition: 'right',
+        class: '!w-full',
       },
       defaultValue: 0,
     },
     {
-      component: 'Input',
       fieldName: 'balanceResult',
       label: '变动后余额(元)',
+      component: 'Input',
       dependencies: {
-        triggerFields: ['changeBalance', 'changeType'],
+        triggerFields: ['balance', 'changeBalance', 'changeType'],
         disabled: true,
         trigger(values, form) {
           form.setFieldValue(
@@ -385,33 +429,33 @@ export function useBalanceFormSchema(): VbenFormSchema[] {
 export function usePointFormSchema(): VbenFormSchema[] {
   return [
     {
-      component: 'Input',
       fieldName: 'id',
       label: '用户编号',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      component: 'Input',
       fieldName: 'nickname',
       label: '用户昵称',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      component: 'Input',
       fieldName: 'point',
       label: '变动前积分',
+      component: 'Input',
       componentProps: {
         disabled: true,
       },
     },
     {
-      component: 'RadioGroup',
       fieldName: 'changeType',
       label: '变动类型',
+      component: 'RadioGroup',
       componentProps: {
         options: [
           { label: '增加', value: 1 },
@@ -423,22 +467,27 @@ export function usePointFormSchema(): VbenFormSchema[] {
       defaultValue: 1,
     },
     {
-      component: 'InputNumber',
       fieldName: 'changePoint',
       label: '变动积分',
+      component: 'InputNumber',
       rules: 'required',
       componentProps: {
         min: 0,
         precision: 0,
+        placeholder: '请输入变动积分',
+        controlsPosition: 'right',
+        class: '!w-full',
       },
-      defaultValue: 0,
     },
     {
-      component: 'Input',
       fieldName: 'pointResult',
       label: '变动后积分',
+      component: 'Input',
+      componentProps: {
+        placeholder: '',
+      },
       dependencies: {
-        triggerFields: ['changePoint', 'changeType'],
+        triggerFields: ['point', 'changePoint', 'changeType'],
         disabled: true,
         trigger(values, form) {
           form.setFieldValue(

apps/web-ele/src/views/member/user/detail/index.vue

@@ -14,19 +14,19 @@ import { getUser } from '#/api/member/user';
 import { getWallet } from '#/api/pay/wallet/balance';
 import { $t } from '#/locales';
 
-import UserAccountInfo from '../components/user-account-info.vue';
+import Form from '../modules/form.vue';
-import UserAddressList from '../components/user-address-list.vue';
+import AccountInfo from './modules/account-info.vue';
-import UserAfterSaleList from '../components/user-after-sale-list.vue';
+import BalanceList from './modules/balance-list.vue';
-import UserBalanceList from '../components/user-balance-list.vue';
+import BasicInfo from './modules/basic-info.vue';
-import UserBasicInfo from '../components/user-basic-info.vue';
+import ExperienceRecordList from './modules/experience-record-list.vue';
-import UserBrokerageList from '../components/user-brokerage-list.vue';
+import PointList from './modules/point-list.vue';
-import UserCouponList from '../components/user-coupon-list.vue';
+import SignList from './modules/sign-list.vue';
-import UserExperienceRecordList from '../components/user-experience-record-list.vue';
+import UserAddressList from './modules/user-address-list.vue';
-import UserFavoriteList from '../components/user-favorite-list.vue';
+import UserAfterSaleList from './modules/user-after-sale-list.vue';
-import UserOrderList from '../components/user-order-list.vue';
+import UserBrokerageList from './modules/user-brokerage-list.vue';
-import UserPointList from '../components/user-point-list.vue';
+import UserCouponList from './modules/user-coupon-list.vue';
-import UserSignList from '../components/user-sign-list.vue';
+import UserFavoriteList from './modules/user-favorite-list.vue';
-import Form from './form.vue';
+import UserOrderList from './modules/user-order-list.vue';
 
 const route = useRoute();
 const { closeCurrentTab, refreshTab } = useTabs();
@@ -39,28 +39,29 @@ const [FormModal, formModalApi] = useVbenModal({
 const userId = Number(route.query.id);
 const user = ref<MemberUserApi.User>();
 const wallet = ref<PayWalletApi.Wallet>();
-const activeName = ref('UserPointList');
+const activeName = ref('PointList');
-/* 钱包初始化数据 */
-const WALLET_INIT_DATA = {
-  balance: 0,
-  totalExpense: 0,
-  totalRecharge: 0,
-} as PayWalletApi.Wallet;
 
+/** 获取会员详情 */
 async function getUserDetail() {
   if (!userId) {
     ElMessage.error('参数错误，会员编号不能为空！');
-    closeCurrentTab();
+    await closeCurrentTab();
     return;
   }
   user.value = await getUser(userId);
-  wallet.value = (await getWallet({ userId })) || WALLET_INIT_DATA;
+  wallet.value = (await getWallet({ userId })) || {
+    balance: 0,
+    totalExpense: 0,
+    totalRecharge: 0,
+  };
 }
 
+/** 编辑会员 */
 function handleEdit() {
   formModalApi.setData(user.value).open();
 }
 
+/** 初始化 */
 onMounted(async () => {
   await getUserDetail();
 });
@@ -69,66 +70,66 @@ onMounted(async () => {
   <Page auto-content-height>
     <FormModal @success="refreshTab" />
     <div class="flex">
-      <UserBasicInfo v-if="user" class="w-3/5" :user="user" mode="member">
+      <BasicInfo v-if="user" class="w-3/5" :user="user" mode="member">
         <template #title> 基本信息 </template>
         <template #extra>
           <ElButton type="primary" @click="handleEdit">
             {{ $t('common.edit') }}
           </ElButton>
         </template>
-      </UserBasicInfo>
+      </BasicInfo>
-      <UserAccountInfo
+      <AccountInfo
         v-if="user && wallet"
         class="ml-4 w-2/5"
         :user="user"
         :wallet="wallet"
       >
         <template #title> 账户信息 </template>
-      </UserAccountInfo>
+      </AccountInfo>
     </div>
     <div class="mt-4">
       <ElCard title="账户明细">
         <ElTabs v-model="activeName">
-          <ElTabPane label="积分" name="UserPointList">
+          <ElTabPane label="积分" name="PointList">
-            <UserPointList class="h-full" :user-id="userId" />
+            <PointList class="h-full" :user-id="userId" />
           </ElTabPane>
-          <ElTabPane label="签到" name="UserSignList">
+          <ElTabPane label="签到" name="SignList">
-            <UserSignList class="h-full" :user-id="userId" />
+            <SignList class="h-full" :user-id="userId" />
           </ElTabPane>
-          <ElTabPane label="成长值" name="UserExperienceRecordList">
+          <ElTabPane label="成长值" name="ExperienceRecordList">
-            <UserExperienceRecordList class="h-full" :user-id="userId" />
+            <ExperienceRecordList class="h-full" :user-id="userId" />
           </ElTabPane>
-          <ElTabPane label="余额" name="UserBalanceList">
+          <ElTabPane label="余额" name="BalanceList">
-            <UserBalanceList class="h-full" :wallet-id="wallet?.id" />
+            <BalanceList class="h-full" :wallet-id="wallet?.id" />
           </ElTabPane>
-          <ElTabPane label="收货地址" name="UserAddressList">
+          <ElTabPane label="收货地址" name="AddressList">
             <UserAddressList class="h-full" :user-id="userId" />
           </ElTabPane>
-          <ElTabPane label="订单管理" name="UserOrderList">
+          <ElTabPane label="订单管理" name="OrderList">
             <!-- Todo: 商城模块 -->
             <div class="h-full">
               <UserOrderList class="h-full" :user-id="userId" />
             </div>
           </ElTabPane>
-          <ElTabPane label="售后管理" name="UserAfterSaleList">
+          <ElTabPane label="售后管理" name="AfterSaleList">
             <!-- Todo: 商城模块 -->
             <div class="h-full">
               <UserAfterSaleList class="h-full" :user-id="userId" />
             </div>
           </ElTabPane>
-          <ElTabPane label="收藏记录" name="UserFavoriteList">
+          <ElTabPane label="收藏记录" name="FavoriteList">
             <!-- Todo: 商城模块 -->
             <div class="h-full">
               <UserFavoriteList class="h-full" :user-id="userId" />
             </div>
           </ElTabPane>
-          <ElTabPane label="优惠劵" name="UserCouponList">
+          <ElTabPane label="优惠劵" name="CouponList">
             <!-- Todo: 商城模块 -->
             <div class="h-full">
               <UserCouponList class="h-full" :user-id="userId" />
             </div>
           </ElTabPane>
-          <ElTabPane label="推广用户" name="UserBrokerageList">
+          <ElTabPane label="推广用户" name="BrokerageList">
             <!-- Todo: 商城模块 -->
             <div class="h-full">
               <UserBrokerageList class="h-full" :user-id="userId" />

apps/web-ele/src/views/member/user/detail/modules/account-info.vue

@@ -19,12 +19,12 @@ withDefaults(
   },
 );
 
-const [Description] = useDescription({
+const [Descriptions] = useDescription({
   componentProps: {
     border: false,
     column: 2,
     direction: 'horizontal',
-    labelWidth: 100,
+    labelWidth: 140,
     title: '',
     extra: '',
   },
@@ -32,7 +32,7 @@ const [Description] = useDescription({
     {
       field: 'levelName',
       label: '等级',
-      content: (data) => data.levelName || '无',
+      content: (data) => data.levelName || '-',
     },
     {
       field: 'experience',
@@ -76,7 +76,7 @@ const [Description] = useDescription({
     <template #extra>
       <slot name="extra"></slot>
     </template>
-    <Description
+    <Descriptions
       :column="mode === 'member' ? 2 : 1"
       :data="{
         ...user,

apps/web-ele/src/views/member/user/detail/modules/balance-list.vue

@@ -15,31 +15,33 @@ const [Grid] = useVbenVxeGrid({
       {
         field: 'id',
         title: '编号',
+        minWidth: 100,
       },
       {
         field: 'title',
         title: '关联业务标题',
+        minWidth: 200,
       },
       {
         field: 'price',
         title: '交易金额',
-        formatter: 'formatAmount2',
+        minWidth: 120,
+        formatter: 'formatFenToYuanAmount',
       },
       {
         field: 'balance',
         title: '钱包余额',
-        formatter: 'formatAmount2',
+        minWidth: 120,
+        formatter: 'formatFenToYuanAmount',
       },
       {
         field: 'createTime',
         title: '交易时间',
+        minWidth: 180,
         formatter: 'formatDateTime',
       },
     ],
     keepSource: true,
-    pagerConfig: {
-      pageSize: 10,
-    },
     proxyConfig: {
       ajax: {
         query: async ({ page }, formValues) => {
@@ -54,6 +56,7 @@ const [Grid] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,

apps/web-ele/src/views/member/user/detail/modules/basic-info.vue

@@ -18,12 +18,12 @@ withDefaults(
   },
 );
 
-const [Description] = useDescription({
+const [Descriptions] = useDescription({
   componentProps: {
     border: false,
     column: 2,
     direction: 'horizontal',
-    labelWidth: 100,
+    labelWidth: 140,
     title: '',
     extra: '',
   },
@@ -60,17 +60,17 @@ const [Description] = useDescription({
     {
       field: 'birthday',
       label: '生日',
-      content: (data) => formatDate(data.birthday)?.toString() || '空',
+      content: (data) => formatDate(data.birthday)?.toString() || '-',
     },
     {
       field: 'createTime',
       label: '注册时间',
-      content: (data) => formatDate(data.createTime)?.toString() || '空',
+      content: (data) => formatDate(data.createTime)?.toString() || '-',
     },
     {
       field: 'loginDate',
       label: '最后登录时间',
-      content: (data) => formatDate(data.loginDate)?.toString() || '空',
+      content: (data) => formatDate(data.loginDate)?.toString() || '-',
     },
   ],
 });
@@ -85,16 +85,16 @@ const [Description] = useDescription({
       <slot name="extra"></slot>
     </template>
     <ElRow v-if="mode === 'member'" :gutter="24">
-      <ElCol :span="4">
+      <ElCol :span="6">
-        <ElAvatar :size="140" shape="square" :src="user.avatar" />
+        <ElAvatar :size="180" shape="square" :src="user.avatar" />
       </ElCol>
-      <ElCol :span="20">
+      <ElCol :span="18">
-        <Description :column="2" :data="user" />
+        <Descriptions :column="2" :data="user" />
       </ElCol>
     </ElRow>
     <template v-else-if="mode === 'kefu'">
       <ElAvatar :size="140" shape="square" :src="user.avatar" />
-      <Description :column="1" :data="user" />
+      <Descriptions :column="1" :data="user" />
     </template>
   </ElCard>
 </template>

apps/web-ele/src/views/member/user/detail/modules/experience-record-list.vue

@@ -4,13 +4,13 @@ import type { MemberExperienceRecordApi } from '#/api/member/experience-record';
 
 import { h } from 'vue';
 
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
 import { ElTag } from 'element-plus';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getExperienceRecordPage } from '#/api/member/experience-record';
-import { DICT_TYPE } from '@vben/constants';
-import { getDictOptions } from '@vben/hooks';
-
 import { getRangePickerDefaultProps } from '#/utils';
 
 const props = defineProps<{
@@ -25,17 +25,22 @@ const [Grid] = useVbenVxeGrid({
         label: '业务类型',
         component: 'Select',
         componentProps: {
-          clearable: true,
           options: getDictOptions(
             DICT_TYPE.MEMBER_EXPERIENCE_BIZ_TYPE,
             'number',
           ),
+          placeholder: '请选择业务类型',
+          clearable: true,
         },
       },
       {
         fieldName: 'title',
         label: '标题',
         component: 'Input',
+        componentProps: {
+          placeholder: '请输入标题',
+          clearable: true,
+        },
       },
       {
         fieldName: 'createDate',
@@ -53,22 +58,24 @@ const [Grid] = useVbenVxeGrid({
       {
         field: 'id',
         title: '编号',
+        minWidth: 100,
       },
       {
         field: 'createTime',
         title: '获得时间',
+        minWidth: 180,
         formatter: 'formatDateTime',
       },
       {
         field: 'experience',
         title: '经验',
+        minWidth: 100,
         slots: {
           default: ({ row }) => {
             return h(
               ElTag,
               {
-                class: 'mr-1',
+                type: row.point > 0 ? 'primary' : 'danger',
-                color: row.experience > 0 ? 'blue' : 'red',
               },
               () =>
                 row.experience > 0 ? `+${row.experience}` : row.experience,
@@ -79,22 +86,27 @@ const [Grid] = useVbenVxeGrid({
       {
         field: 'totalExperience',
         title: '总经验',
+        minWidth: 100,
       },
       {
         field: 'title',
         title: '标题',
+        minWidth: 200,
       },
       {
         field: 'description',
         title: '描述',
+        minWidth: 250,
       },
       {
         field: 'bizId',
         title: '业务编号',
+        minWidth: 120,
       },
       {
         field: 'bizType',
         title: '业务类型',
+        minWidth: 120,
         cellRender: {
           name: 'CellDict',
           props: { type: DICT_TYPE.MEMBER_EXPERIENCE_BIZ_TYPE },
@@ -102,9 +114,6 @@ const [Grid] = useVbenVxeGrid({
       },
     ],
     keepSource: true,
-    pagerConfig: {
-      pageSize: 10,
-    },
     proxyConfig: {
       ajax: {
         query: async ({ page }, formValues) => {
@@ -119,6 +128,7 @@ const [Grid] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,

apps/web-ele/src/views/member/user/detail/modules/point-list.vue

@@ -23,6 +23,7 @@ const [Grid] = useVbenVxeGrid({
         component: 'Select',
         componentProps: {
           clearable: true,
+          placeholder: '请选择业务类型',
           options: getDictOptions(DICT_TYPE.MEMBER_POINT_BIZ_TYPE, 'number'),
         },
       },

apps/web-ele/src/views/member/user/detail/modules/sign-list.vue

@@ -18,6 +18,10 @@ const [Grid] = useVbenVxeGrid({
         fieldName: 'day',
         label: '签到天数',
         component: 'Input',
+        componentProps: {
+          placeholder: '请输入签到天数',
+          clearable: true,
+        },
       },
       {
         fieldName: 'createTime',
@@ -33,9 +37,6 @@ const [Grid] = useVbenVxeGrid({
   gridOptions: {
     columns: useGridColumns(),
     keepSource: true,
-    pagerConfig: {
-      pageSize: 10,
-    },
     proxyConfig: {
       ajax: {
         query: async ({ page }, formValues) => {
@@ -50,6 +51,7 @@ const [Grid] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,

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

@@ -19,33 +19,39 @@ const [Grid] = useVbenVxeGrid({
       {
         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',
-                color: row.defaultStatus ? 'blue' : 'red',
+                type: row.defaultStatus ? 'primary' : 'danger',
               },
               () => (row.defaultStatus ? '是' : '否'),
             );
@@ -56,6 +62,7 @@ const [Grid] = useVbenVxeGrid({
         field: 'createTime',
         title: '创建时间',
         formatter: 'formatDateTime',
+        minWidth: 160,
       },
     ],
     keepSource: true,