From 63cdff9c41f5ad88e535a376a824bf8640dc5cab Mon Sep 17 00:00:00 2001
From: R2m1liA <15258427350@163.com>
Date: Fri, 5 Dec 2025 17:18:48 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=B8=BA=E6=96=87=E6=A1=A3=E5=BA=93?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E6=96=87=E6=A1=A3=E7=B1=BB=E5=9E=8B=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 功能添加：在文档列表中，当未指定文档类型时，在标题右侧显示文档类型
- 查询更改：产品查询添加文档类型查询方法
- mapper更改：productDocumentView添加文档类型
---
 app/components/shared/DocumentList.vue | 25 ++++++++++++++++++++++++-
 app/pages/support/documents.vue        |  8 +++++++-
 server/assets/graphql/product.graphql  |  7 +++++++
 server/mappers/productMapper.test.ts   | 25 +++++++++++++++++++++++++
 server/mappers/productMapper.ts        | 12 ++++++++++++
 shared/types/views/product-view.ts     |  5 +++++
 6 files changed, 80 insertions(+), 2 deletions(-)

diff --git a/app/components/shared/DocumentList.vue b/app/components/shared/DocumentList.vue
index de8669d..36d08fa 100644
--- a/app/components/shared/DocumentList.vue
+++ b/app/components/shared/DocumentList.vue
@@ -7,7 +7,17 @@
       @click="handleClick(doc.fileId)"
     >
       <div class="document-info">
-        <h3>{{ doc.title }}</h3>
+        <div class="document-title">
+          <h3>
+            {{ doc.title }}
+            <span v-if="showCategory && doc.type" class="document-category">
+              |
+            </span>
+            <span v-if="showCategory && doc.type" class="document-category">
+              {{ doc.type.name }}
+            </span>
+          </h3>
+        </div>
         <div class="document-content">
           <span v-if="doc.size" class="document-meta"
             >{{ $t('document-meta.size') }}: {{ formatFileSize(doc.size) }}
@@ -28,6 +38,10 @@
       type: Array as () => Array<ProductDocumentView>,
       default: () => [],
     },
+    showCategory: {
+      type: Boolean,
+      default: true,
+    },
   });
 
   const localePath = useLocalePath();
@@ -63,6 +77,15 @@
     color: var(--el-text-color-secondary);
   }
 
+  .document-title {
+    margin-bottom: 0.5rem;
+  }
+
+  .document-category {
+    font-size: 0.75rem;
+    color: var(--el-text-color-secondary);
+  }
+
   .download-button {
     margin-left: auto;
   }
diff --git a/app/pages/support/documents.vue b/app/pages/support/documents.vue
index 8c0db6f..5bf8fd3 100644
--- a/app/pages/support/documents.vue
+++ b/app/pages/support/documents.vue
@@ -17,7 +17,13 @@
           :document-type-options="documentTypeOptions"
         />
 
-        <document-list :documents="paginatedDocuments" />
+        <document-list
+          :documents="paginatedDocuments"
+          :show-category="
+            filters.selectedDocumentType === null ||
+            filters.selectedDocumentType === undefined
+          "
+        />
 
         <el-pagination
           v-model:current-page="page"
diff --git a/server/assets/graphql/product.graphql b/server/assets/graphql/product.graphql
index 187ea3c..fdf5920 100644
--- a/server/assets/graphql/product.graphql
+++ b/server/assets/graphql/product.graphql
@@ -51,6 +51,13 @@ query GetProduct($id: ID!, $locale: String!) {
       id
       product_documents_id(filter: { status: { _eq: "published" } }) {
         id
+        type {
+          id
+          translations(filter: { languages_code: { code: { _eq: $locale } } }) {
+            id
+            name
+          }
+        }
         file {
           id
           filesize
diff --git a/server/mappers/productMapper.test.ts b/server/mappers/productMapper.test.ts
index 3afad1a..931e8af 100644
--- a/server/mappers/productMapper.test.ts
+++ b/server/mappers/productMapper.test.ts
@@ -347,6 +347,15 @@ describe('toProductDocumentView', () => {
             filesize: 1000,
             filename_download: 'doc1.pdf',
           },
+          type: {
+            id: 1,
+            translations: [
+              {
+                id: 1,
+                name: 'manual',
+              },
+            ],
+          },
           translations: [
             {
               id: 1,
@@ -363,6 +372,10 @@ describe('toProductDocumentView', () => {
         fileId: 'rand-om__-uuid-1234',
         filename: 'doc1.pdf',
         title: 'Document Title 1',
+        type: {
+          id: '1',
+          name: 'manual',
+        },
         size: 1000,
         url: '/api/assets/rand-om__-uuid-1234',
       },
@@ -391,6 +404,10 @@ describe('toProductDocumentView', () => {
         fileId: 'rand-om__-uuid-1234',
         filename: 'doc1.pdf',
         title: '',
+        type: {
+          id: '-1',
+          name: '',
+        },
         size: 1000,
         url: '/api/assets/rand-om__-uuid-1234',
       },
@@ -413,6 +430,10 @@ describe('toProductDocumentView', () => {
         filename: '',
         title: '',
         size: 0,
+        type: {
+          id: '-1',
+          name: '',
+        },
         url: '',
       },
       {
@@ -421,6 +442,10 @@ describe('toProductDocumentView', () => {
         filename: '',
         title: '',
         size: 0,
+        type: {
+          id: '-1',
+          name: '',
+        },
         url: '',
       },
     ]);
diff --git a/server/mappers/productMapper.ts b/server/mappers/productMapper.ts
index 2896d96..453b85a 100644
--- a/server/mappers/productMapper.ts
+++ b/server/mappers/productMapper.ts
@@ -1,4 +1,5 @@
 import { isObject } from '../../server/utils/object';
+import { toDocumentTypeView } from './documentMapper';
 
 /**
  * 将 Directus 返回的 ProductImage 数据转换为 ProductImageView 视图模型
@@ -161,6 +162,10 @@ export function toProductDocumentView(
         size: 0,
         title: '',
         url: '',
+        type: {
+          id: '-1',
+          name: '',
+        },
       } satisfies ProductDocumentView;
     }
 
@@ -173,6 +178,10 @@ export function toProductDocumentView(
         size: 0,
         title: '',
         url: '',
+        type: {
+          id: '-1',
+          name: '',
+        },
       } satisfies ProductDocumentView;
     }
 
@@ -184,6 +193,8 @@ export function toProductDocumentView(
 
     const trans = document.translations?.[0];
 
+    const typeView = toDocumentTypeView(document.type ?? null);
+
     return {
       id: item.id.toString(),
       fileId: file?.id ?? '',
@@ -191,6 +202,7 @@ export function toProductDocumentView(
       size: file?.filesize ?? 0,
       title: trans?.title ?? '',
       url: url,
+      type: typeView,
     } satisfies ProductDocumentView;
   });
 }
diff --git a/shared/types/views/product-view.ts b/shared/types/views/product-view.ts
index 7407ddc..0c2a08a 100644
--- a/shared/types/views/product-view.ts
+++ b/shared/types/views/product-view.ts
@@ -1,3 +1,5 @@
+import type { DocumentTypeView } from './document-list-view';
+
 /**
  * 产品图片视图模型
  * 用于产品详情页(/products/[slug])中的产品图片数据结构
@@ -73,6 +75,9 @@ export interface ProductDocumentView {
   /** 文档大小 **/
   size: number;
 
+  /** 文档类型 **/
+  type: DocumentTypeView;
+
   /** 文档链接 **/
   url: string;
 }