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)" >
-

{{ doc.title }}

+
+

+ {{ doc.title }} + + | + + + {{ doc.type.name }} + +

+
{{ $t('document-meta.size') }}: {{ formatFileSize(doc.size) }} @@ -28,6 +38,10 @@ type: Array as () => Array, 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" /> - + { 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; }