feat：【antd】【ele】【member 会员】signin 迁移 antd

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

@@ -6,6 +6,16 @@ import { getDictOptions } from '@vben/hooks';
 
 import { z } from '#/adapter/form';
 
+/** 奖励验证函数 */
+const awardValidator = (value: number, formData: any, field: string) => {
+  const point = formData.point || 0;
+  const experience = formData.experience || 0;
+  if (point === 0 && experience === 0) {
+    return '奖励积分与奖励经验至少配置一个';
+  }
+  return true;
+};
+
 /** 新增/修改的表单 */
 export function useFormSchema(): VbenFormSchema[] {
   return [
@@ -26,7 +36,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 +47,11 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         min: 0,
         precision: 0,
+        placeholder: '请输入获得积分',
       },
+      rules: z.number().min(0, '获得积分不能小于0').refine(awardValidator, {
+        message: '奖励积分与奖励经验至少配置一个',
+      }),
     },
     {
       component: 'InputNumber',
@@ -44,7 +60,11 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         min: 0,
         precision: 0,
+        placeholder: '请输入奖励经验',
       },
+      rules: z.number().min(0, '奖励经验不能小于0').refine(awardValidator, {
+        message: '奖励积分与奖励经验至少配置一个',
+      }),
     },
     {
       fieldName: 'status',
@@ -63,39 +83,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();
 }
 
@@ -47,7 +47,7 @@ async function handleDelete(row: MemberSignInConfigApi.SignInConfig) {
     message.success({
       content: $t('ui.actionMessage.deleteSuccess'),
     });
-    onRefresh();
+    handleRefresh();
   } finally {
     hideLoading();
   }
@@ -70,6 +70,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
@@ -81,7 +82,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',
@@ -26,7 +34,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       component: 'RangePicker',
       componentProps: {
         ...getRangePickerDefaultProps(),
-        allowClear: true,
+        placeholder: ['开始日期', '结束日期'],
       },
     },
   ];
@@ -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>