From 059687e1f565f98ecc7354e612f37f58d01f102e Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sat, 26 Apr 2025 09:39:52 +0800
Subject: [PATCH] =?UTF-8?q?review=EF=BC=9A=E3=80=90=E5=85=A8=E5=B1=80?=
 =?UTF-8?q?=E3=80=91Description=20=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/description/description.vue  | 17 +++++++++++++----
 .../src/components/description/typing.ts        |  9 +++++++++
 .../components/description/use-description.ts   |  1 +
 .../views/system/notify/my/modules/detail.vue   |  3 +++
 4 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/apps/web-antd/src/components/description/description.vue b/apps/web-antd/src/components/description/description.vue
index 411333778..25dab3cec 100644
--- a/apps/web-antd/src/components/description/description.vue
+++ b/apps/web-antd/src/components/description/description.vue
@@ -1,12 +1,14 @@
 <script lang="tsx">
-import type { DescriptionItemSchema, DescriptionsOptions } from './typing';
 import type { DescriptionsProps } from 'ant-design-vue';
+
 import type { PropType } from 'vue';
 
-import { Descriptions, DescriptionsItem } from 'ant-design-vue';
+import type { DescriptionItemSchema, DescriptionsOptions } from './typing';
 
 import { defineComponent } from 'vue';
 
+import { Descriptions, DescriptionsItem } from 'ant-design-vue';
+
 /** 对 Descriptions 进行二次封装 */
 const Description = defineComponent({
   name: 'Descriptions',
@@ -27,15 +29,21 @@ const Description = defineComponent({
   },
 
   setup(props: DescriptionsOptions) {
+    // TODO @puhui999：每个 field 的 slot 的考虑
+    // TODO @puhui999：from 5.0：extra: () => getSlot(slots, 'extra')
     /** 过滤掉不需要展示的 */
     const shouldShowItem = (item: DescriptionItemSchema) => {
       if (item.hidden === undefined) return true;
-      return typeof item.hidden === 'function' ? !item.hidden(props.data) : !item.hidden;
+      return typeof item.hidden === 'function'
+        ? !item.hidden(props.data)
+        : !item.hidden;
     };
     /** 渲染内容 */
     const renderContent = (item: DescriptionItemSchema) => {
       if (item.content) {
-        return typeof item.content === 'function' ? item.content(props.data) : item.content;
+        return typeof item.content === 'function'
+          ? item.content(props.data)
+          : item.content;
       }
       return item.field ? props.data?.[item.field] : null;
     };
@@ -67,5 +75,6 @@ const Description = defineComponent({
   },
 });
 
+// TODO @puhui999：from 5.0：emits: ['register'] 事件
 export default Description;
 </script>
diff --git a/apps/web-antd/src/components/description/typing.ts b/apps/web-antd/src/components/description/typing.ts
index 98e3a52d1..c1628d248 100644
--- a/apps/web-antd/src/components/description/typing.ts
+++ b/apps/web-antd/src/components/description/typing.ts
@@ -1,6 +1,10 @@
 import type { DescriptionsProps } from 'ant-design-vue';
+
 import type { CSSProperties, VNode } from 'vue';
 
+// TODO @puhui999：【content】这个纠结下；1）vben2.0 是 render；https://doc.vvbin.cn/components/desc.html#usage 2）
+// TODO @puhui999：vben2.0 还有 sapn【done】、labelMinWidth、contentMinWidth
+// TODO @puhui999：【hidden】这个纠结下；1）vben2.0 是 show；
 export interface DescriptionItemSchema {
   label: string | VNode; // 内容的描述
   field?: string; // 对应 data 中的字段名
@@ -11,6 +15,11 @@ export interface DescriptionItemSchema {
   hidden?: ((data: any) => boolean) | boolean; // 是否显示
 }
 
+// TODO @puhui999：vben2.0 还有 title【done】、bordered【done】d、useCollapse、collapseOptions
+// TODO @puhui999：from 5.0：bordered 默认为 true
+// TODO @puhui999：from 5.0：column 默认为 lg: 3, md: 3, sm: 2, xl: 3, xs: 1, xxl: 4
+// TODO @puhui999：from 5.0：size 默认为 small；有 'default', 'middle', 'small', undefined
+// TODO @puhui999：from 5.0：useCollapse 默认为 true
 export interface DescriptionsOptions {
   data?: Record<string, any>; // 数据
   schema?: DescriptionItemSchema[]; // 描述项配置
diff --git a/apps/web-antd/src/components/description/use-description.ts b/apps/web-antd/src/components/description/use-description.ts
index 8cf44ccfa..5140a88c1 100644
--- a/apps/web-antd/src/components/description/use-description.ts
+++ b/apps/web-antd/src/components/description/use-description.ts
@@ -16,6 +16,7 @@ class DescriptionApi {
     return this.state as DescriptionsOptions;
   }
 
+  // TODO @puhui999：【setState】纠结下：1）vben2.0 是 data https://doc.vvbin.cn/components/desc.html#usage；
   setState(newState: Partial<DescriptionsOptions>) {
     this.state = { ...this.state, ...newState };
   }
diff --git a/apps/web-antd/src/views/system/notify/my/modules/detail.vue b/apps/web-antd/src/views/system/notify/my/modules/detail.vue
index a2d94fd7a..69dc6b02e 100644
--- a/apps/web-antd/src/views/system/notify/my/modules/detail.vue
+++ b/apps/web-antd/src/views/system/notify/my/modules/detail.vue
@@ -10,8 +10,10 @@ import { useDescription } from '#/components/description';
 import { DictTag } from '#/components/dict-tag';
 import { DICT_TYPE } from '#/utils/dict';
 
+// TODO @puhui999：formData 貌似不需要了
 const formData = ref<SystemNotifyMessageApi.NotifyMessage>();
 
+// TODO @puhui999：descriptionApi 好点，更清晰哈；
 const [Description, descApi] = useDescription({
   componentProps: {
     bordered: true,
@@ -19,6 +21,7 @@ const [Description, descApi] = useDescription({
     size: 'middle',
     class: 'mx-4',
   },
+  // TODO @puhui999：是不是也放到 data 里；
   schema: [
     {
       field: 'templateNickname',