From 91584096bab9f732495c92987326d73ab2c41f23 Mon Sep 17 00:00:00 2001 From: R2m1liA <15258427350@163.com> Date: Wed, 27 Aug 2025 13:17:55 +0800 Subject: [PATCH] =?UTF-8?q?Feature:=20=E4=BA=A7=E5=93=81=E5=B8=B8=E8=A7=81?= =?UTF-8?q?=E9=97=AE=E9=A2=98=20&=20=E7=9B=B8=E5=85=B3=E6=96=87=E6=A1=A3?= =?UTF-8?q?=E4=B8=8B=E8=BD=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/pages/productions/[...slug].vue | 107 ++++++++++++++++++++++++---- app/types/strapi/common.ts | 1 + app/types/strapi/index.ts | 3 +- app/types/strapi/production.ts | 1 + app/types/strapi/question.ts | 4 ++ app/utils/file.ts | 12 ++++ 6 files changed, 114 insertions(+), 14 deletions(-) create mode 100644 app/types/strapi/question.ts create mode 100644 app/utils/file.ts diff --git a/app/pages/productions/[...slug].vue b/app/pages/productions/[...slug].vue index 67b837c..47f03c5 100644 --- a/app/pages/productions/[...slug].vue +++ b/app/pages/productions/[...slug].vue @@ -15,9 +15,7 @@
- +

{{ production.title }}

@@ -27,14 +25,42 @@
- + - + +
+ + + + + +
+ + +
+ +
+

{{ doc.caption || doc.name }}

+
+ 大小: {{ formatFileSize(doc.size) }} + 格式: {{ formatFileExtension(doc.ext) }} + + 下载 + +
+
+ +
+
@@ -76,6 +102,19 @@ const activeName = ref('details') // 默认选中概览标签 // 获取路由参数（slug 或 id） const documentId = computed(() => route.params.slug as string) +const downloadFile = async (filename: string, url: string) => { + const response = await fetch(url) + const blob = await response.blob() + const fileUrl = window.URL.createObjectURL(blob) + + const link = document.createElement('a') + link.href = fileUrl + link.download = filename + document.body.appendChild(link) + link.click() + document.body.removeChild(link) + window.URL.revokeObjectURL(fileUrl) +} onMounted(async () => { try { @@ -90,6 +129,12 @@ onMounted(async () => { cover: { populate: '*', }, + questions: { + populate: '*', + }, + documents: { + populate: '*', + }, }, locale: strapiLocale, }) @@ -99,6 +144,7 @@ onMounted(async () => { ...item, } } + console.log('Fetched Production:', production.value) } catch (error) { console.error('Failed to fetch production:', error) } finally { @@ -125,14 +171,12 @@ useHead({ .breadcrumb { padding: 2rem; - margin-bottom: 2rem; } .production-header { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; - margin-bottom: 3rem; } .production-image .el-image { @@ -154,12 +198,9 @@ useHead({ margin-bottom: 2rem; } -.production-content { - margin-top: 2rem; -} - -.production-tabs ::v-deep(.el-tabs__item) { - margin-left: 20px; +.production-tabs ::v-deep(.el-tabs__nav) { + min-width: 30%; + float: right; } .production-tabs ::v-deep(.el-tabs__content) { @@ -171,6 +212,46 @@ useHead({ margin: 0; } +.document-list { + display: flex; + flex-direction: column; + gap: 1rem; + margin-top: 1rem; +} + +.document-meta { + color: var(--el-text-color-secondary); + font-size: 0.8rem; +} + +.download-button { + margin-left: auto; +} + +.document-content { + display: flex; + align-items: center; + gap: 1rem; +} + +::v-deep(.el-collapse-item__header) { + font-size: 1rem; + padding: 1rem; +} + +.faq-collapse { + border: none; +} + +.faq-collapse :deep(.el-collapse-item) { + margin-bottom: 1rem; + box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1); +} + +.faq-collapse :deep(.el-collapse-item__header) { + border: 1px solid var(--el-border-color-light); +} + .loading { display: flex; justify-content: center; diff --git a/app/types/strapi/common.ts b/app/types/strapi/common.ts index 6979b7e..135802b 100644 --- a/app/types/strapi/common.ts +++ b/app/types/strapi/common.ts @@ -12,6 +12,7 @@ export interface StrapiMedia { url: string; ext: string; name: string; + size: number; alternativeText: string; caption: string; } diff --git a/app/types/strapi/index.ts b/app/types/strapi/index.ts index 79baa52..f77045d 100644 --- a/app/types/strapi/index.ts +++ b/app/types/strapi/index.ts @@ -1,4 +1,5 @@ export * from './common'; export * from './production'; export * from './singleTypes'; -export * from './solution'; \ No newline at end of file +export * from './solution'; +export * from './question'; \ No newline at end of file diff --git a/app/types/strapi/production.ts b/app/types/strapi/production.ts index 0e55740..bf124f3 100644 --- a/app/types/strapi/production.ts +++ b/app/types/strapi/production.ts @@ -22,6 +22,7 @@ export interface Production extends StrapiEntity { production_images: StrapiImage[]; production_details: string; production_specs: ProductionSpecGroup[]; + questions: Question[]; documents: StrapiMedia[]; show_in_production_list: boolean; } \ No newline at end of file diff --git a/app/types/strapi/question.ts b/app/types/strapi/question.ts new file mode 100644 index 0000000..4204a28 --- /dev/null +++ b/app/types/strapi/question.ts @@ -0,0 +1,4 @@ +export interface Question extends StrapiEntity { + title: string; + content: string; +} \ No newline at end of file diff --git a/app/utils/file.ts b/app/utils/file.ts new file mode 100644 index 0000000..13fe114 --- /dev/null +++ b/app/utils/file.ts @@ -0,0 +1,12 @@ +export function formatFileSize(sizeInKB: number): string { + if (sizeInKB < 1024) { + return `${sizeInKB.toFixed(2)} KB`; + } else { + const sizeInMB = sizeInKB / 1024; + return `${sizeInMB.toFixed(2)} MB`; + } +} + +export function formatFileExtension(ext: string): string { + return ext.startsWith('.') ? ext.slice(1).toUpperCase() : ext.toUpperCase(); +} \ No newline at end of file