feat：增加 DictTag 字典标签组件

apps/web-antd/src/views/system/notify/my/modules/detail.vue

@@ -2,13 +2,14 @@
 import type { SystemNotifyMessageApi } from '#/api/system/notify/message';
 
 import { useVbenModal } from '@vben/common-ui';
-import { Descriptions, Tag } from 'ant-design-vue';
+import { Descriptions } from 'ant-design-vue';
+import { DictTag } from '#/components/dict-tag';
 
 import { ref } from 'vue';
 import { formatDateTime } from '@vben/utils';
-import { DICT_TYPE, getDictLabel } from '#/utils/dict';
+import { DICT_TYPE } from '#/utils/dict';
 
-const messageData = ref<SystemNotifyMessageApi.SystemNotifyMessage>();
+const formData = ref<SystemNotifyMessageApi.SystemNotifyMessage>();
 
 const [Modal, modalApi] = useVbenModal({
   async onOpenChange(isOpen: boolean) {
@@ -22,7 +23,7 @@ const [Modal, modalApi] = useVbenModal({
     }
     modalApi.lock();
     try {
-      messageData.value = data;
+      formData.value = data;
     } finally {
       modalApi.lock(false);
     }
@@ -33,58 +34,39 @@ const [Modal, modalApi] = useVbenModal({
 <template>
   <Modal title="我的站内信">
     <Descriptions bordered :column="1" size="middle" class="mx-4">
-      <Descriptions.Item label="编号">{{ messageData?.id }}</Descriptions.Item>
+      <Descriptions.Item label="编号">{{ formData?.id }}</Descriptions.Item>
       <Descriptions.Item label="用户类型">
-        <!-- TODO @芋艿: 数据字典-->
-        <Tag color="processing">
-          {{ getDictLabel(DICT_TYPE.USER_TYPE, messageData?.userType) }}
-        </Tag>
+        <DictTag :type="DICT_TYPE.USER_TYPE" :value="formData?.userType" />
       </Descriptions.Item>
       <Descriptions.Item label="用户编号">
-        {{ messageData?.userId }}
+        {{ formData?.userId }}
       </Descriptions.Item>
       <Descriptions.Item label="模版编号">
-        {{ messageData?.templateId }}
+        {{ formData?.templateId }}
       </Descriptions.Item>
       <Descriptions.Item label="模板编码">
-        {{ messageData?.templateCode }}
+        {{ formData?.templateCode }}
       </Descriptions.Item>
       <Descriptions.Item label="发送人名称">
-        {{ messageData?.templateNickname }}
+        {{ formData?.templateNickname }}
       </Descriptions.Item>
       <Descriptions.Item label="模版内容">
-        {{ messageData?.templateContent }}
+        {{ formData?.templateContent }}
       </Descriptions.Item>
       <Descriptions.Item label="模版参数">
-        {{ messageData?.templateParams }}
+        {{ formData?.templateParams }}
       </Descriptions.Item>
       <Descriptions.Item label="模版类型">
-        <!-- TODO @芋艿: 数据字典-->
-        <Tag color="processing">
-          {{
-            getDictLabel(
-              DICT_TYPE.SYSTEM_NOTIFY_TEMPLATE_TYPE,
-              messageData?.templateType,
-            )
-          }}
-        </Tag>
+        <DictTag :type="DICT_TYPE.SYSTEM_NOTIFY_TEMPLATE_TYPE" :value="formData?.templateType" />
       </Descriptions.Item>
       <Descriptions.Item label="是否已读">
-        <!-- TODO @芋艿: 数据字典-->
-        <Tag color="processing">
-          {{
-            getDictLabel(
-              DICT_TYPE.INFRA_BOOLEAN_STRING,
-              messageData?.readStatus,
-            )
-          }}
-        </Tag>
+        <DictTag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="formData?.readStatus" />
       </Descriptions.Item>
       <Descriptions.Item label="阅读时间">
-        {{ formatDateTime(messageData?.readTime || '') }}
+        {{ formatDateTime(formData?.readTime || '') }}
       </Descriptions.Item>
       <Descriptions.Item label="创建时间">
-        {{ formatDateTime(messageData?.createTime || '') }}
+        {{ formatDateTime(formData?.createTime || '') }}
       </Descriptions.Item>
     </Descriptions>
   </Modal>