review：【mall 商城】product 相关代码

apps/web-ele/src/views/mall/product/category/index.vue

@@ -166,7 +166,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               icon: ACTION_ICON.VIEW,
               auth: ['product:category:update'],
               ifShow: row.parentId !== undefined && row.parentId > 0,
-              onClick: handleViewSpu.bind(null, row.id || 0),
+              onClick: handleViewSpu.bind(null, row.id!),
             },
             {
               label: $t('common.delete'),

apps/web-ele/src/views/mall/product/comment/data.ts

@@ -27,6 +27,7 @@ export function useFormSchema(): VbenFormSchema[] {
       },
       rules: 'required',
     },
+    // TODO @霖：用户头像，有点丑，多了一层
     {
       fieldName: 'userAvatar',
       label: '用户头像',
@@ -45,6 +46,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'Textarea',
       rules: 'required',
     },
+    // TODO @霖：星级缺了；
     {
       fieldName: 'descriptionScores',
       label: '描述星级',
@@ -57,6 +59,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'Rate',
       rules: 'required',
     },
+    // TODO @霖：评价图片，有点丑，多了一层
     {
       fieldName: 'picUrls',
       label: '评论图片',
@@ -111,6 +114,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
 }
 
 /** 表格列配置 */
+// TODO @霖：列表的宽度需要优化下，样式~
 export function useGridColumns<T = MallCommentApi.Comment>(
   onStatusChange?: (
     newStatus: boolean,

apps/web-ele/src/views/mall/product/comment/index.vue

@@ -59,6 +59,7 @@ function handleReply(row: MallCommentApi.Comment) {
 }
 
 /** 更新状态 */
+// TODO @霖：貌似刷新后，就会触发
 async function handleStatusChange(
   newStatus: boolean,
   row: MallCommentApi.Comment,

apps/web-ele/src/views/mall/product/spu/data.ts

@@ -7,6 +7,8 @@ import { handleTree } from '@vben/utils';
 import { getCategoryList } from '#/api/mall/product/category';
 import { getRangePickerDefaultProps } from '#/utils';
 
+// TODO @霖：所有 mall 的 search 少了，请输入 xxx；表单也是类似
+
 /** 列表的搜索表单 */
 export function useGridFormSchema(): VbenFormSchema[] {
   return [

apps/web-ele/src/views/mall/product/spu/index.vue

@@ -65,7 +65,7 @@ const tabsData = ref([
 
 /** 刷新表格 */
 async function onRefresh() {
-  gridApi.query();
+  await gridApi.query();
   await getTabCount();
 }
 
@@ -105,7 +105,7 @@ async function handleDelete(row: MallSpuApi.Spu) {
   try {
     await deleteSpu(row.id as number);
     ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
-    onRefresh();
+    await onRefresh();
   } finally {
     hideLoading.close();
   }
@@ -121,7 +121,7 @@ async function handleStatus02Change(row: MallSpuApi.Spu, newStatus: number) {
   await confirm(`确认要"${row.name}"${text}吗？`);
   await updateStatus({ id: row.id as number, status: newStatus });
   ElMessage.success(`${text}成功`);
-  onRefresh();
+  await onRefresh();
 }
 
 /** 更新状态 */
@@ -205,13 +205,13 @@ function onChangeTab(key: any) {
 onMounted(async () => {
   // 解析路由的 categoryId
   if (route.query.categoryId) {
-    gridApi.formApi.setValues({
+    await gridApi.formApi.setValues({
       categoryId: Number(route.query.categoryId),
     });
   }
   await getTabCount();
-  const res = await getCategoryList({});
-  categoryList.value = handleTree(res, 'id', 'parentId', 'children');
+  const categoryRes = await getCategoryList({});
+  categoryList.value = handleTree(categoryRes, 'id', 'parentId', 'children');
 });
 </script>
 
@@ -226,6 +226,7 @@ onMounted(async () => {
 
     <Grid>
       <template #top>
+        <!-- TODO @xingyu：tabs 可以考虑往上以一些，和操作按钮在一排 -->
         <ElTabs class="border-none" @tab-change="onChangeTab">
           <ElTabs.TabPane
             v-for="item in tabsData"
@@ -255,6 +256,7 @@ onMounted(async () => {
           ]"
         />
       </template>
+      <!-- TODO @霖：展开的样子，不展示信息 -->
       <template #expand_content="{ row }">
         <ElDescriptions
           :column="4"

apps/web-ele/src/views/mall/product/spu/modules/form.vue

@@ -143,6 +143,7 @@ onMounted(async () => {
 </script>
 
 <template>
+  <!-- TODO @霖：样式有点丑，要不照 vue3 + element-plus 在优化下？ -->
   <Page :auto-content-height="true">
     <ElTabs v-model="activeTab">
       <ElTabPane label="基础设置" name="info">