From 9520d7016e07804e499df414d6664ee091d186c4 Mon Sep 17 00:00:00 2001
From: xingyu4j <xingyu4j@vip.qq.com>
Date: Thu, 9 Oct 2025 17:07:30 +0800
Subject: [PATCH] feat: use Rate

---
 .../src/views/mall/product/comment/data.ts    | 21 +++++++++----------
 .../src/views/mall/product/comment/index.vue  |  8 ++++++-
 2 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/apps/web-antd/src/views/mall/product/comment/data.ts b/apps/web-antd/src/views/mall/product/comment/data.ts
index 7ee32ed19..2b37fab9e 100644
--- a/apps/web-antd/src/views/mall/product/comment/data.ts
+++ b/apps/web-antd/src/views/mall/product/comment/data.ts
@@ -70,23 +70,16 @@ export function useFormSchema(): VbenFormSchema[] {
       },
       rules: 'required',
     },
-    // TODO @xingyu：无法使用 Rate 组件，会报 TypeError: Cannot read properties of undefined (reading 'prefixCls')
     {
       fieldName: 'descriptionScores',
       label: '描述星级',
-      component: 'InputNumber',
-      componentProps: {
-        placeholder: '请选择描述星级',
-      },
+      component: 'Rate',
       rules: z.number().min(1).max(5).default(5),
     },
     {
       fieldName: 'benefitScores',
       label: '服务星级',
-      component: 'InputNumber',
-      componentProps: {
-        placeholder: '请选择服务星级',
-      },
+      component: 'Rate',
       rules: z.number().min(1).max(5).default(5),
     },
     {
@@ -204,12 +197,18 @@ export function useGridColumns<T = MallCommentApi.Comment>(
     {
       field: 'descriptionScores',
       title: '商品评分',
-      minWidth: 90,
+      minWidth: 150,
+      slots: {
+        default: 'descriptionScores',
+      },
     },
     {
       field: 'benefitScores',
       title: '服务评分',
-      minWidth: 90,
+      minWidth: 150,
+      slots: {
+        default: 'benefitScores',
+      },
     },
     {
       field: 'content',
diff --git a/apps/web-antd/src/views/mall/product/comment/index.vue b/apps/web-antd/src/views/mall/product/comment/index.vue
index f12a0e5f2..cbae411d4 100644
--- a/apps/web-antd/src/views/mall/product/comment/index.vue
+++ b/apps/web-antd/src/views/mall/product/comment/index.vue
@@ -6,7 +6,7 @@ import { h } from 'vue';
 
 import { confirm, DocAlert, Page, prompt, useVbenModal } from '@vben/common-ui';
 
-import { message, Textarea } from 'ant-design-vue';
+import { message, Rate, Textarea } from 'ant-design-vue';
 
 import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
 import {
@@ -129,6 +129,12 @@ const [Grid, gridApi] = useVbenVxeGrid({
     </template>
     <FormModal @success="handleRefresh" />
     <Grid table-title="评论列表">
+      <template #descriptionScores="{ row }">
+        <Rate v-model:value="row.descriptionScores" :disabled="true" />
+      </template>
+      <template #benefitScores="{ row }">
+        <Rate v-model:value="row.benefitScores" :disabled="true" />
+      </template>
       <template #toolbar-tools>
         <TableAction
           :actions="[