remilia/jinshen-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: 将Data到ViewModel的转换由App转移至Server端
All checks were successful
deploy to server / build-and-deploy (push) Successful in 3m42s
Details

Browse Source 
- 将逻辑转移到Server端后，简化前端逻辑
This commit is contained in:
R2m1liA
2025-11-13 20:51:09 +08:00
parent e215a4d498 23f2700c0f
commit 154943815d
70 changed files with 697 additions and 614 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
app/models/mappers/companyProfileMapper.test.ts
View File

@ -1,31 +0,0 @@
import { expect, test, describe } from 'vitest';
/**
* 单元测试: companyProfileMapper
*/
describe('companyProfileMapper', () => {
test('convert raw data to CompanyProfileView correctly', () => {
const rawData: CompanyProfile = {
id: 1,
translations: [
{ id: 10, content: 'This is raw data of company profile' },
],
};
expect(toCompanyProfileView(rawData)).toEqual({
id: 1,
content: 'This is raw data of company profile',
});
});
test('convert raw data with missing translations', () => {
const rawData: CompanyProfile = {
id: 1,
translations: [],
};
expect(toCompanyProfileView(rawData)).toEqual({
id: 1,
content: '',
});
});
});

17
app/models/mappers/companyProfileMapper.ts
View File

@ -1,17 +0,0 @@
/**
* 将 Directus 返回的 CompanyProfile 数据转换为 CompanyProfileView 视图模型
*
* @param raw: 原始的 CompanyProfile 数据
* @returns 转换后的 CompanyProfileView 对象
*
* @example
* const view = toCompanyProfileView(rawCompanyProfile);
*/
export function toCompanyProfileView(raw: CompanyProfile): CompanyProfileView {
const trans = raw.translations?.[0] ?? { content: '' };
return {
id: raw.id,
content: trans.content,
};
}

30
app/models/mappers/contactInfoMapper.test.ts
View File

@ -1,30 +0,0 @@
import { describe, test, expect } from 'vitest';
/**
* 单元测试: contactInfoMapper
*/
describe('contactInfoMapper', () => {
test('convert raw data to ContactInfoView correctly', () => {
const rawData: ContactInfo = {
id: 1,
translations: [{ id: 10, content: 'This is raw data of contact info' }],
};
expect(toContactInfoView(rawData)).toEqual({
id: 1,
content: 'This is raw data of contact info',
});
});
test('convert raw data with missing translations', () => {
const rawData: ContactInfo = {
id: 1,
translations: [],
};
expect(toContactInfoView(rawData)).toEqual({
id: 1,
content: '',
});
});
});

17
app/models/mappers/contactInfoMapper.ts
View File

@ -1,17 +0,0 @@
/**
* 将 Directus 返回的 ContactInfo 数据转换为 ContactInfoView 视图模型
*
* @param raw: 原始的 ContactInfo 数据
* @returns 转换后的 ContactInfoView 对象
*
* @example
* const view = toContactInfoView(rawContactInfo);
*/
export function toContactInfoView(raw: ContactInfo): ContactInfoView {
const trans = raw.translations?.[0] ?? { content: '' };
return {
id: raw.id,
content: trans.content,
};
}

106
app/models/mappers/documentMapper.test.ts
View File

@ -1,106 +0,0 @@
import { describe, test, expect } from 'vitest';
/**
* 单元测试: toProductDocumentView
*/
describe('toProductDocumentView', () => {
test('convert raw data with fileId to ProductDocumentView correctly', () => {
const rawData: ProductDocument = {
id: 1,
file: 'rand-om__-uuid-1234',
translations: [{ id: 10, title: 'Document Title' }],
};
expect(toProductDocumentView(rawData)).toEqual({
id: 1,
fileId: 'rand-om__-uuid-1234',
filename: undefined,
title: 'Document Title',
url: 'http://localhost:8055/assets/rand-om__-uuid-1234',
size: undefined,
});
});
test('convert raw data with fileMeta to ProductDocumentView correctly', () => {
const rawData: ProductDocument = {
id: 1,
file: {
id: 'rand-om__-uuid-1234',
filename_download: 'document.pdf',
filesize: 2048,
},
translations: [{ id: 10, title: 'Document Title' }],
};
expect(toProductDocumentView(rawData)).toEqual({
id: 1,
fileId: 'rand-om__-uuid-1234',
filename: 'document.pdf',
title: 'Document Title',
url: 'http://localhost:8055/assets/rand-om__-uuid-1234',
size: 2048,
});
});
test('convert raw data with missing translations', () => {
const rawData: ProductDocument = {
id: 1,
file: 'rand-om__-uuid-1234',
translations: [],
};
expect(toProductDocumentView(rawData)).toEqual({
id: 1,
fileId: 'rand-om__-uuid-1234',
filename: undefined,
title: '',
url: 'http://localhost:8055/assets/rand-om__-uuid-1234',
size: undefined,
});
});
});
/**
* 单元测试: toDocumentListView
*/
describe('toProductDocumentView', () => {
test('convert raw data with fileId to DocumentListView correctly', () => {
const rawData: ProductDocument = {
id: 1,
file: 'rand-om__-uuid-1234',
translations: [{ id: 10, title: 'Document Title' }],
products: [
{
id: 10,
products_id: {
id: 1,
translations: [{ id: 1, name: 'Product A' }],
product_type: {
id: 1,
translations: [{ id: 1, name: 'Type A' }],
},
},
},
],
};
expect(toDocumentListView(rawData)).toEqual({
id: 1,
fileId: 'rand-om__-uuid-1234',
filename: undefined,
title: 'Document Title',
url: 'http://localhost:8055/assets/rand-om__-uuid-1234',
size: undefined,
products: [
{
id: 1,
name: 'Product A',
type: {
id: 1,
name: 'Type A',
},
},
],
});
});
});

79
app/models/mappers/documentMapper.ts
View File

@ -1,79 +0,0 @@
/**
* 将 Directus 返回的 Document 数据转换为 ProductDocumentView 视图模型
*
* @param raw: 原始的 Document 数据
* @returns 转换后的 ProductDocumentView 对象
*
* @example
* const view = toProductDocumentView(rawDocument);
*/
export function toProductDocumentView(
raw: ProductDocument
): ProductDocumentView {
const trans = raw.translations?.[0] ?? {
title: '',
};
const fileId = typeof raw.file === 'string' ? raw.file : raw.file?.id;
const file = raw.file as DirectusFile;
const { getFileUrl } = useDirectusFiles();
const url = getFileUrl(fileId);
return {
id: raw.id,
fileId: fileId,
filename: file.filename_download,
title: trans.title,
url: url,
size: file.filesize,
};
}
/**
* 将 Directus 返回的 Document 数据转换为 DocumentListView 视图模型
*
* @param raw: 原始的 Document 数据
* @returns 转换后的 DocumentListView 对象
*
* @example
* const view = toDocumentListView(rawDocument);
*/
export function toDocumentListView(raw: ProductDocument): DocumentListView {
const trans = raw.translations?.[0] ?? { title: '' };
const fileId = typeof raw.file === 'string' ? raw.file : raw.file?.id;
const file = raw.file as DirectusFile;
const { getFileUrl } = useDirectusFiles();
const url = getFileUrl(fileId);
const related_products: DocumentListProduct[] = raw.products
?.filter(isObject<ProductsProductDocument>)
.map((item) => item.products_id)
.filter(isObject<Product>)
.map((item) => {
const productType =
isObject<ProductType>(item.product_type) &&
({
id: item.product_type.id,
name: item.product_type.translations?.[0]?.name,
} satisfies DocumentListProductType);
return {
id: item.id,
name: item.translations?.[0]?.name,
type: productType,
};
});
return {
id: raw.id,
fileId: fileId,
filename: file.filename_download,
title: trans.title,
url: url,
size: file.filesize,
products: related_products,
};
}

88
app/models/mappers/homepageMapper.test.ts
View File

@ -1,88 +0,0 @@
import { describe, test, expect } from 'vitest';
/**
* 单元测试: toHomepageView
*/
describe('toHomepageView', () => {
test('convert raw data to HomepageView correctly', () => {
const rawData: Homepage = {
id: 1,
carousel: [
{
id: 1,
directus_files_id: {
id: 'file-uuid-1',
},
},
{
id: 2,
directus_files_id: {
id: 'file-uuid-2',
},
},
],
recommend_products: [
{
id: 1,
translations: [{ id: 1, name: 'Product 1', summary: 'Summary 1' }],
cover: 'cover-file-uuid-1',
},
{
id: 2,
translations: [{ id: 2, name: 'Product 2', summary: 'Summary 2' }],
cover: { id: 'cover-file-uuid-2' },
},
],
recommend_solutions: [
{
id: 1,
translations: [{ id: 1, title: 'Solution 1', summary: 'Summary 1' }],
cover: 'cover-file-uuid-1',
},
],
};
expect(toHomepageView(rawData)).toEqual({
id: 1,
carousel: ['file-uuid-1', 'file-uuid-2'],
recommendProducts: [
{
id: 1,
name: 'Product 1',
summary: 'Summary 1',
cover: 'cover-file-uuid-1',
},
{
id: 2,
name: 'Product 2',
summary: 'Summary 2',
cover: 'cover-file-uuid-2',
},
],
recommendSolutions: [
{
id: 1,
title: 'Solution 1',
summary: 'Summary 1',
cover: 'cover-file-uuid-1',
},
],
});
});
test('convert raw data with missing translations', () => {
const rawData: Homepage = {
id: 1,
carousel: [],
recommend_products: [{ id: 1, translations: [], cover: null }],
recommend_solutions: [{ id: 1, translations: [], cover: null }],
};
expect(toHomepageView(rawData)).toEqual({
id: 1,
carousel: [],
recommendProducts: [{ id: 1, name: '', summary: '', cover: null }],
recommendSolutions: [{ id: 1, title: '', summary: '', cover: null }],
});
});
});

54
app/models/mappers/homepageMapper.ts
View File

@ -1,54 +0,0 @@
/**
* 将 Directus 返回的 Homepage 数据转换为 HomepageView 视图模型
*
* @param raw: 原始的 Homepage 数据
* @returns 转换后的 HomepageView 对象
*
* @example
* const view = toHomepageView(rawHomepage);
*/
export function toHomepageView(raw: Homepage): HomepageView {
const carousel = (raw.carousel ?? [])
.filter(isObject<HomepageFile>)
.map((item) => item.directus_files_id)
.filter(isObject<DirectusFile>)
.map((file) => file.id);
const products = (raw.recommend_products ?? [])
.filter(isObject<Product>)
.map((item) => {
const cover = isObject<DirectusFile>(item.cover)
? item.cover.id
: item.cover;
const trans = item.translations?.[0] ?? { name: '', summary: '' };
return {
id: item.id,
name: trans.name,
summary: trans.summary,
cover: cover,
} satisfies HomepageProductView;
});
const solutions = (raw.recommend_solutions ?? [])
.filter(isObject<Solution>)
.map((item) => {
const cover = isObject<DirectusFile>(item.cover)
? item.cover.id
: item.cover;
const trans = item.translations?.[0] ?? { title: '', summary: '' };
return {
id: item.id,
title: trans.title,
summary: trans.summary,
cover: cover,
} satisfies HomepageSolutionView;
});
return {
id: raw.id,
carousel: carousel ?? [],
recommendProducts: products ?? [],
recommendSolutions: solutions ?? [],
};
}

182
app/models/mappers/productMapper.test.ts
View File

@ -1,182 +0,0 @@
import { describe, test, expect } from 'vitest';
/**
* 单元测试: toProductListView
*/
describe('toProductListView', () => {
test('convert raw data to ProductListView correctly', () => {
const rawData: Product = {
id: 1,
translations: [
{ id: 10, name: 'Product Name', summary: 'Product Summary' },
],
cover: {
id: 'cover-file-uuid-1234',
},
product_type: {
id: 1,
translations: [{ id: 20, name: 'Type Name' }],
sort: 1,
},
};
expect(toProductListView(rawData)).toEqual({
id: 1,
name: 'Product Name',
summary: 'Product Summary',
cover: 'cover-file-uuid-1234',
product_type: {
id: 1,
name: 'Type Name',
sort: 1,
},
});
});
test('convert raw data with missing translations', () => {
const rawData: Product = {
id: 1,
translations: [],
cover: {
id: 'cover-file-uuid-1234',
},
product_type: {
id: 20,
translations: [],
sort: 1,
},
};
expect(toProductListView(rawData)).toEqual({
id: 1,
name: '',
summary: '',
cover: 'cover-file-uuid-1234',
product_type: {
id: 20,
name: '',
sort: 1,
},
});
});
});
/**
* 单元测试: toProductSpecView
*/
describe('toProductSpecView', () => {
test('convert raw data to ProductSpecView correctly', () => {
const rawData: ProductSpec = {
id: 1,
translations: [{ id: 1, key: 'Key', value: 'Value' }],
};
expect(toProductSpecView(rawData)).toEqual({
id: 1,
key: 'Key',
value: 'Value',
});
});
test('convert raw data with missing translations', () => {
const rawData: ProductSpec = {
id: 1,
translations: [],
};
expect(toProductSpecView(rawData)).toEqual({
id: 1,
key: '',
value: '',
});
});
});
/**
* 单元测试: toProductSpecGroupView
*/
describe('toProductSpecGroupView', () => {
test('convert raw data to ProductSpecGroupView correctly', () => {
const rawData: ProductSpecGroup = {
id: 1,
translations: [{ id: 1, name: 'Group Name' }],
specs: [
{ id: 1, translations: [{ id: 1, key: 'Key1', value: 'Value1' }] },
{ id: 2, translations: [{ id: 2, key: 'Key2', value: 'Value2' }] },
],
};
expect(toProductSpecGroupView(rawData)).toEqual({
id: 1,
name: 'Group Name',
specs: [
{ id: 1, key: 'Key1', value: 'Value1' },
{ id: 2, key: 'Key2', value: 'Value2' },
],
});
});
test('convert raw data with missing translations', () => {
const rawData: ProductSpecGroup = {
id: 1,
translations: [],
specs: [],
};
expect(toProductSpecGroupView(rawData)).toEqual({
id: 1,
name: '',
specs: [],
});
});
});
/**
* 单元测试: toProductView
*/
describe('toProductView', () => {
test('convert raw data to ProductView correctly', () => {
const rawData: Product = {
id: 1,
translations: [
{
id: 1,
name: 'Product Name',
summary: 'Product Summary',
description: 'Product Description',
},
],
};
expect(toProductView(rawData)).toEqual({
id: 1,
name: 'Product Name',
summary: 'Product Summary',
description: 'Product Description',
product_type: '',
images: [],
documents: [],
faqs: [],
specs: [],
});
});
test('convert raw data with missing translations', () => {
const rawData: Product = {
id: 1,
translations: [],
};
expect(toProductView(rawData)).toEqual({
id: 1,
name: '',
summary: '',
description: '',
product_type: '',
images: [],
documents: [],
faqs: [],
specs: [],
});
});
});

156
app/models/mappers/productMapper.ts
View File

@ -1,156 +0,0 @@
/**
* 将Directus返回的ProductType数据转换为ProductTypeView视图模型
*
* @param raw: 原始的ProductType数据
* @returns 转换后的ProductTypeView对象
*
* @example
* const view = toProductTypeView(rawProductType);
*/
export function toProductTypeView(raw: ProductType): ProductTypeView {
const trans = raw.translations?.[0] ?? { name: '' };
return {
id: raw.id,
name: trans.name,
sort: raw?.sort ?? 999,
};
}
/**
* 将 Directus返回的 Product 数据转换为 ProductListView 视图模型
*
* @param raw: 原始的 Product 数据
* @returns 转换后的 ProductListView 对象
*
* @example
* const view = toProductListView(rawProduct);
*/
export function toProductListView(raw: Product): ProductListView {
const trans = raw.translations?.[0] ?? { name: '', summary: '' };
const type = isObject<ProductType>(raw.product_type)
? toProductTypeView(raw.product_type)
: undefined;
const cover = isObject<DirectusFile>(raw.cover) ? raw.cover.id : '';
return {
id: raw.id,
product_type: type,
name: trans.name,
summary: trans.summary,
cover: cover,
};
}
/**
* 将 Directus 返回的 ProductSpecGroup 数据转换为 ProductSpecGroupView 视图模型
*
* @param raw: 原始的 ProductSpecGroup 数据
* @returns 转换后的 ProductSpecGroupView 对象
*
* @example
* const view = toProductSpecGroupView(rawSpecGroup);
*/
export function toProductSpecGroupView(
raw: ProductSpecGroup
): ProductSpecGroupView {
const trans = raw.translations?.[0] ?? {
name: '',
};
return {
id: raw.id,
name: trans.name,
specs: raw.specs
.filter(isObject<ProductSpec>)
.map((item) => toProductSpecView(item)),
};
}
/**
* 将 Directus 返回的 ProductSpec 数据转换为 ProductSpecView 视图模型
*
* @param raw: 原始的 ProductSpec 数据
* @returns 转换后的 ProductSpecView 对象
*
* @example
* const view = toProductSpecView(rawSpecGroup);
*/
export function toProductSpecView(raw: ProductSpec): ProductSpecView {
const trans = raw.translations?.[0] ?? {
key: '',
value: '',
};
return {
id: raw.id,
key: trans.key,
value: trans.value,
};
}
/**
* 将 Directus 返回的 Product 数据转换为 ProductView 视图模型
*
* @param raw: 原始的 Product 数据
* @returns 转换后的 ProductView 对象
*
* @example
* const view = toProductView(rawProduct);
*/
export function toProductView(raw: Product): ProductView {
const trans = raw.translations?.[0] ?? {
name: '',
summary: '',
description: '',
};
const images = (raw.images ?? [])
.filter(isObject<ProductsProductImage>)
.map((item) => item.product_images_id)
.filter(isObject<ProductImage>)
.map((item) => {
const image = isObject<DirectusFile>(item.image) ? item.image.id : '';
return {
id: item.id,
image: image,
caption: item.translations?.[0]?.caption || '',
};
});
const specs = (raw.specs ?? [])
.filter(isObject<ProductSpecGroup>)
.map((item) => toProductSpecGroupView(item));
const faqs = (raw.faqs ?? [])
.filter(isObject<ProductsQuestion>)
.map((item) => item.questions_id)
.filter(isObject<Question>)
.map((item) => toProductQuestionView(item));
const documents = (raw.documents ?? [])
.filter(isObject<ProductsProductDocument>)
.map((item) => item.product_documents_id)
.filter(isObject<ProductDocument>)
.map((item) => toProductDocumentView(item));
return {
id: raw.id,
product_type:
typeof raw.product_type === 'string'
? raw.product_type
: typeof raw.product_type === 'object' && raw.product_type
? raw.product_type.translations[0].name || ''
: '',
name: trans.name,
summary: trans.summary,
images: images,
description: trans.description,
specs: specs,
faqs: faqs,
documents: documents,
};
}

113
app/models/mappers/questionMapper.test.ts
View File

@ -1,113 +0,0 @@
import { describe, expect, test } from 'vitest';
/**
* 单元测试: toProductQuestionView
*/
describe('toProductQuestionView', () => {
test('convert raw data to ProductQuestionView correctly', () => {
const rawData: Question = {
id: 1,
translations: [
{ id: 1, title: 'Question Title', content: 'Question Answer' },
],
};
expect(toProductQuestionView(rawData)).toEqual({
id: 1,
title: 'Question Title',
content: 'Question Answer',
});
});
test('convert raw data with missing translations', () => {
const rawData: Question = {
id: 1,
translations: [],
};
expect(toProductQuestionView(rawData)).toEqual({
id: 1,
title: '',
content: '',
});
});
});
/**
* 单元测试: toQuestionListView
*/
describe('toQuestionListView', () => {
test('convert raw data to QuestionListView correctly', () => {
const rawData: Question = {
id: 1,
translations: [
{ id: 1, title: 'Question Title', content: 'Question Answer' },
],
products: [
{
id: 1,
products_id: {
id: 1,
translations: [{ id: 1, name: 'Product Name' }],
product_type: {
id: 1,
translations: [{ id: 1, name: 'Type Name' }],
},
},
},
],
};
expect(toQuestionListView(rawData)).toEqual({
id: 1,
title: 'Question Title',
content: 'Question Answer',
products: [
{
id: 1,
name: 'Product Name',
type: {
id: 1,
name: 'Type Name',
},
},
],
});
});
test('convert raw data with missing translations', () => {
const rawData: Question = {
id: 1,
translations: [],
products: [
{
id: 1,
products_id: {
id: 1,
translations: [],
product_type: {
id: 1,
translations: [],
},
},
},
],
};
expect(toQuestionListView(rawData)).toEqual({
id: 1,
title: '',
content: '',
products: [
{
id: 1,
name: '',
type: {
id: 1,
name: '',
},
},
],
});
});
});

59
app/models/mappers/questionMapper.ts
View File

@ -1,59 +0,0 @@
/**
* 将 Directus 返回的 Question 数据转换为 ProductQuestionView 视图模型
*
* @param raw: 原始的 Question 数据
* @returns 转换后的 ProductQuestionView 对象
*
* @example
* const view = toProductQuestionView(rawQuestion);
*/
export function toProductQuestionView(raw: Question): ProductQuestionView {
const trans = raw.translations?.[0] ?? { title: '', content: '' };
return {
id: raw.id,
title: trans.title,
content: trans.content,
};
}
/**
* 将 Directus 返回的 Question 数据转换为 QuestionListView 视图模型
*
* @param raw: 原始的 Question 数据
* @returns 转换后的 QuestionListView 对象
* ---
* @example
* const view = toQuestionListView(rawQuestion);
*/
export function toQuestionListView(raw: Question): QuestionListView {
const trans = raw.translations?.[0] ?? { title: '', content: '' };
const related_products: QuestionListProduct[] = (raw.products ?? [])
.filter(isObject<ProductsQuestion>)
.map((item) => item.products_id)
.filter(isObject<Product>)
.map((item) => {
const translations = item.translations[0] ?? { name: '' };
const product_type =
isObject<ProductType>(item.product_type) &&
({
id: item.product_type.id,
name: item.product_type.translations[0]?.name ?? '',
} satisfies QuestionListProductType);
return {
id: item.id,
name: translations.name,
type: product_type,
};
});
return {
id: raw.id,
title: trans.title,
content: trans.content,
products: related_products,
};
}

16
app/models/mappers/searchItemMapper.ts
View File

@ -1,16 +0,0 @@
/**
* 搜索索引转换器
* @param hit 搜索条目
* @returns 转换后的搜索条目视图模型
*
* ---
* @example
* const view = toSearchItemView(item, 'products');
*/
export function toSearchItemView<T extends MeiliSearchItemType>(
item: MeiliIndexMap[T],
type: T
): SearchItemView {
const converter = converters[type];
return converter ? converter(item) : null;
}

98
app/models/mappers/solutionMapper.test.ts
View File

@ -1,98 +0,0 @@
import { describe, test, expect } from 'vitest';
/**
* 单元测试: toSolutionListView
*/
describe('toSolutionListView', () => {
test('convert raw data to SolutionListView correctly', () => {
const rawData: Solution = {
id: 1,
translations: [
{ id: 1, title: 'Solution Title', summary: 'Solution Summary' },
],
type: {
id: 1,
translations: [{ id: 1, name: 'Type Name' }],
sort: 1,
},
};
expect(toSolutionListView(rawData)).toEqual({
id: 1,
title: 'Solution Title',
summary: 'Solution Summary',
solution_type: {
id: 1,
name: 'Type Name',
sort: 1,
},
});
});
test('convert raw data with missing translations', () => {
const rawData: Solution = {
id: 1,
translations: [],
type: {
id: 1,
translations: [],
sort: null,
},
};
expect(toSolutionListView(rawData)).toEqual({
id: 1,
title: '',
summary: '',
solution_type: {
id: 1,
name: '',
sort: 999,
},
});
});
});
/**
* 单元测试: toSolutionView
*/
describe('toSolutionView', () => {
test('convert raw data to SolutionView correctly', () => {
const rawData: Solution = {
id: 1,
translations: [
{
id: 1,
title: 'Solution Title',
summary: 'Solution Summary',
content: 'Solution Content',
},
],
create_at: '2023-01-01T00:00:00Z',
};
expect(toSolutionView(rawData)).toEqual({
id: 1,
title: 'Solution Title',
summary: 'Solution Summary',
content: 'Solution Content',
createAt: '2023-01-01T00:00:00Z',
});
});
test('convert raw data with missing translations', () => {
const rawData: Solution = {
id: 1,
translations: [],
create_at: '2023-01-01T00:00:00Z',
};
expect(toSolutionView(rawData)).toEqual({
id: 1,
title: '',
summary: '',
content: '',
createAt: '2023-01-01T00:00:00Z',
});
});
});

77
app/models/mappers/solutionMapper.ts
View File

@ -1,77 +0,0 @@
/**
* 将 Directus 返回的 SolutionType 数据转换为 SolutionTypeView 视图模型
*
* @param raw: 原始的 SolutionType 数据
* @returns 转换后的 SolutionTypeView 对象
*
* ---
*
* @example
* const view = toSolutionTypeView(rawSolutionType);
*/
export function toSolutionTypeView(raw: SolutionType): SolutionTypeView {
const trans = raw.translations?.[0] ?? { name: '' };
return {
id: raw.id,
name: trans.name,
sort: raw?.sort ?? 999,
};
}
/**
* 将 Directus 返回的 Solution 数据转换为 SolutionListView 视图模型
*
* @param raw: 原始的 Solution 数据
* @returns 转换后的 SolutionListView 对象
*
* ---
*
* @example
* const view = toSolutionListView(rawSolution);
*/
export function toSolutionListView(raw: Solution): SolutionListView {
const trans = raw.translations?.[0] ?? {
title: '',
summary: '',
};
const type = isObject<SolutionType>(raw.type)
? toSolutionTypeView(raw.type)
: undefined;
return {
id: raw.id,
title: trans.title,
summary: trans.summary,
solution_type: type,
cover: isObject<DirectusFile>(raw.cover) ? raw.cover.id : raw.cover,
};
}
/**
* 将 Directus 返回的 Solution 数据转换为 SolutionView 视图模型
*
* @param raw: 原始的 Solution 数据
* @returns 转换后的 SolutionView 对象
*
* ---
*
* @example
* const view = toSolutionView(rawSolution);
*/
export function toSolutionView(raw: Solution): SolutionView {
const trans = raw.translations?.[0] ?? {
title: '',
summary: '',
content: '',
};
return {
id: raw.id,
title: trans.title,
summary: trans.summary,
content: trans.content,
createAt: raw.create_at,
};
}

66
app/models/utils/object.test.ts
View File

@ -1,66 +0,0 @@
import { expect, test, describe } from 'vitest';
/**
* 单元测试: isObject
*/
describe('isObject', () => {
test('identify plain object', () => {
expect(isObject({})).toBe(true);
expect(isObject({ key: 'value' })).toBe(true);
});
test('identify null as non objevt', () => {
expect(isObject(null)).toBe(false);
});
test('identify non-object types', () => {
expect(isObject(undefined)).toBe(false);
expect(isObject(42)).toBe(false);
expect(isObject('string')).toBe(false);
expect(isObject(Symbol('sym'))).toBe(false);
expect(isObject(true)).toBe(false);
expect(isObject(() => {})).toBe(false);
});
test('identify arrays as objects', () => {
expect(isObject([])).toBe(true);
});
test('identify narrowed object type', () => {
const value: unknown = { id: 1 };
if (isObject<{ id: number }>(value)) {
expect(value.id).toBe(1);
} else {
throw new Error('Type narrowing failed');
}
});
});
/**
* 单元测试: isArrayOfObject
*/
describe('isArrayOfObject', () => {
test('identify array of plain objects', () => {
const arr = [{ id: 1 }, { name: 'Alice' }];
expect(isArrayOfObject<{ id?: number; name?: string }>(arr)).toBe(true);
});
test('identify array containing non-objects', () => {
expect(isArrayOfObject([1, 2, 3])).toBe(false);
expect(isArrayOfObject([{ id: 1 }, null])).toBe(false);
expect(isArrayOfObject([{ id: 1 }, 'string'])).toBe(false);
});
test('identify non-array types', () => {
expect(isArrayOfObject(null)).toBe(false);
expect(isArrayOfObject({})).toBe(false);
expect(isArrayOfObject(42)).toBe(false);
});
test('identify empty array as array of objects', () => {
expect(isArrayOfObject([])).toBe(true);
});
test('identify narrowed array of object type', () => {
const data: unknown = [{ id: 1 }, { id: 2 }];
if (isArrayOfObject<{ id: number }>(data)) {
// TS 能识别为 { id: number }[]
expect(data[0].id).toBe(1);
expect(data[1].id).toBe(2);
} else {
throw new Error('Type guard failed');
}
});
});

30
app/models/utils/object.ts
View File

@ -1,30 +0,0 @@
/**
* 判断某一值是否为非null对象
*
* @template T 泛型类型，用于推断目标对象的类型
* @param value: 需要判断的值
* @returns 如果值是非null对象则返回true，否则返回false
*
* @example
* if (isObject<Product>(value)) value.id
*/
export const isObject = <T extends object>(value: unknown): value is T =>
typeof value === 'object' && value !== null;
/**
* 判断某一值是否为非null对象组成的数组
*
* @template T 泛型类型，用于推断目标对象的类型
* @param value: 需要判断的值
* @returns 如果值是非null对象组成的数组则返回true，否则返回false
*
* @example
* const data: unknown = [{ id: 1 }, { id: 2 }];
* if (isArrayOfObject)<{ id: number }>(data) {
* // TypeScript 知道 data 是 { id: number }[] 类型
* console.log(data[0].id);
* }
*/
export const isArrayOfObject = <T extends object>(arr: unknown): arr is T[] => {
return Array.isArray(arr) && arr.every(isObject<T>);
};

76
app/models/utils/search-converter.test.ts
View File

@ -1,76 +0,0 @@
import { describe, expect, test } from 'vitest';
/**
* 单元测试: converters
*/
describe('converters', () => {
test('convert product item', () => {
const item = {
id: 1,
name: 'Hydraulic Pump',
summary: 'High efficiency',
description: 'Detailed description',
type: 'pump',
};
const result = converters.products(item);
expect(result).toEqual({
id: 1,
type: 'product',
title: 'Hydraulic Pump',
summary: 'High efficiency',
});
});
test('convert solution item', () => {
const item = {
id: 1,
title: 'Solution A',
summary: 'Effective solution',
content: 'Detailed content',
type: 'Type A',
};
const result = converters.solutions(item);
expect(result).toEqual({
id: 1,
type: 'solution',
title: 'Solution A',
summary: 'Effective solution',
});
});
test('convert question item', () => {
const item = {
id: 1,
title: 'How to use product?',
content:
'This is a detailed explanation of how to use the product effectively.',
products: ['Product A'],
product_types: ['Type A'],
};
const result = converters.questions(item);
expect(result).toEqual({
id: 1,
title: 'How to use product?',
summary:
'This is a detailed explanation of how to use the product effectively....',
type: 'question',
});
});
test('convert product document item', () => {
const item = {
id: 1,
title: 'User Manual',
products: ['Product A'],
product_types: ['Type A'],
fileUUID: 'TEST-UUID',
};
const result = converters.product_documents(item);
expect(result).toEqual({
id: 'TEST-UUID',
title: 'User Manual',
summary: undefined,
type: 'document',
});
});
});

35
app/models/utils/search-converters.ts
View File

@ -1,35 +0,0 @@
/**
* 各索引对应的转换函数表
*/
export const converters: {
[K in keyof MeiliIndexMap]: (item: MeiliIndexMap[K]) => SearchItemView;
} = {
products: (item: MeiliIndexMap['products']): SearchItemView => ({
id: item.id,
type: 'product',
title: item.name,
summary: item.summary,
}),
solutions: (item: MeiliIndexMap['solutions']): SearchItemView => ({
id: item.id,
type: 'solution',
title: item.title,
summary: item.summary,
}),
questions: (item: MeiliIndexMap['questions']): SearchItemView => ({
id: item.id,
type: 'question',
title: item.title,
summary: item.content.slice(0, 100) + '...',
}),
product_documents: (
item: MeiliIndexMap['product_documents']
): SearchItemView => ({
id: item.fileUUID || item.id,
type: 'document',
title: item.title,
}),
};

10
app/models/views/CompanyProfileView.ts
View File

@ -1,10 +0,0 @@
/**
* 公司简介视图模型
*/
export interface CompanyProfileView {
/** 唯一标识符 **/
id: number;
/** 内容 **/
content: string;
}

10
app/models/views/ContactInfoView.ts
View File

@ -1,10 +0,0 @@
/**
* 联系信息视图模型
*/
export interface ContactInfoView {
/** 唯一标识符 **/
id: number;
/** 内容 **/
content: string;
}

45
app/models/views/DocumentListView.ts
View File

@ -1,45 +0,0 @@
/**
* 文档关联产品类型模型
* 用于在文档库中提供产品筛选功能
*/
export interface DocumentListProductType {
id: number;
name: string;
}
/**
* 文档关联产品模型
* 用于在文档库中提供产品筛选功能
*/
export interface DocumentListProduct {
id: number;
name: string;
type: DocumentListProductType;
}
/**
* 文档列表模型
* 用于文档库(/support/documents)页面渲染的数据结构
*/
export interface DocumentListView {
/** 唯一标识符 **/
id: number;
/** 文件UUID **/
fileId: string;
/** 文件名 **/
filename: string;
/** 文档标题 **/
title: string;
/** 文档大小 **/
size: number;
/** 文档链接 **/
url: string;
/** 相关产品 **/
products: DocumentListProduct[];
}

50
app/models/views/HomepageView.ts
View File

@ -1,50 +0,0 @@
/**
* 主页推荐产品视图模型
*/
export interface HomepageProductView {
/** 唯一标识符 **/
id: number;
/** 产品名称 **/
name: string;
/** 产品简介 **/
summary: string;
/** 产品封面 **/
cover: string;
}
/**
* 主页推荐解决方案视图模型
*/
export interface HomepageSolutionView {
/** 唯一标识符 **/
id: number;
/** 解决方案标题 **/
title: string;
/** 解决方案摘要 **/
summary: string;
/** 解决方案封面 **/
cover: string;
}
/**
* 主页视图模型
*/
export interface HomepageView {
/** 唯一标识符 **/
id: number;
/** 首页图片 **/
carousel: string[];
/** 首页推荐产品 **/
recommendProducts: HomepageProductView[];
/** 首页推荐解决方案 **/
recommendSolutions: HomepageSolutionView[];
}

23
app/models/views/ProductDocumentView.ts
View File

@ -1,23 +0,0 @@
/**
* 文档视图模型
* 用于文档列表渲染的数据结构
*/
export interface ProductDocumentView {
/** 唯一标识符 **/
id: number;
/** 文件UUID **/
fileId: string;
/** 文件名 **/
filename: string;
/** 文档标题 **/
title: string;
/** 文档大小 **/
size: number;
/** 文档链接 **/
url: string;
}

35
app/models/views/ProductListView.ts
View File

@ -1,35 +0,0 @@
/**
* 产品类型视图模型
* 用于产品列表页的section渲染与排序
*/
export interface ProductTypeView {
/** 唯一标识符 **/
id: number;
/** 类型名 **/
name: string;
/** 排序字段 **/
sort: number;
}
/**
* 产品列表视图模型
* 用于产品列表(/products)渲染的数据结构
*/
export interface ProductListView {
/** 唯一标识符 **/
id: number;
/** 产品名称 **/
name: string;
/** 产品简介 **/
summary: string;
/** 产品类型 **/
product_type: ProductTypeView;
/** 产品封面(图片的id) **/
cover: string;
}

14
app/models/views/ProductQuestionView.ts
View File

@ -1,14 +0,0 @@
/**
* 常见问题视图模型
* 用于产品页常见问题渲染的数据结构
*/
export interface ProductQuestionView {
/** 唯一标识符 **/
id: number;
/** 问题标题 **/
title: string;
/** 问题内容 **/
content: string;
}

29
app/models/views/ProductSpecGroupView.ts
View File

@ -1,29 +0,0 @@
/**
* 产品规格模型
* 用于产品规格渲染的数据结构
*/
export interface ProductSpecView {
/** 唯一标识符 **/
id: number;
/** 规格名称 **/
key: string;
/** 规格值 **/
value: string;
}
/**
* 产品规格表模型
* 用于产品规格表渲染的数据结构
*/
export interface ProductSpecGroupView {
/** 唯一标识符 **/
id: number;
/** 规格组名称 **/
name: string;
/** 规格组 **/
specs: ProductSpecView[];
}

38
app/models/views/ProductView.ts
View File

@ -1,38 +0,0 @@
interface ImageView {
id: number;
image: string;
caption: string;
}
/**
* 产品视图模型
* 用于产品详情页(/products/[slug])渲染的数据结构
*/
export interface ProductView {
/** 唯一标识符 **/
id: number;
/** 产品名称 **/
name: string;
/** 产品简介 **/
summary: string;
/** 产品类型 **/
product_type: string;
/** 产品图片 **/
images: ImageView[];
/** 产品详情 **/
description: string;
/** 产品规格 **/
specs: ProductSpecGroupView[];
/** 产品常见问题 **/
faqs: ProductQuestionView[];
/** 产品文档 **/
documents: ProductDocumentView[];
}

36
app/models/views/QuestionListVuew.ts
View File

@ -1,36 +0,0 @@
/**
* 问题关联产品类型模型
* 用于在常见问题列表中提供产品筛选功能
*/
export interface QuestionListProductType {
id: number;
name: string;
}
/**
* 问题关联产品模型
* 用于在常见问题列表中提供产品筛选功能
*/
export interface QuestionListProduct {
id: number;
name: string;
type: QuestionListProductType;
}
/**
* 常见问题列表视图模型
* 用于常见问题列表(/support/faq)页面渲染的数据结构
*/
export interface QuestionListView {
/** 唯一标识符 **/
id: number;
/** 问题标题 **/
title: string;
/** 问题内容 **/
content: string;
/** 关联产品 **/
products: QuestionListProduct[];
}

13
app/models/views/SearchItemView.ts
View File

@ -1,13 +0,0 @@
export interface SearchItemView {
/** 唯一标识符 **/
id: number | string;
/** 条目类型 **/
type: 'product' | 'solution' | 'question' | 'document';
/** 条目标题 **/
title: string;
/** 条目摘要 **/
summary?: string;
}

35
app/models/views/SolutionListView.ts
View File

@ -1,35 +0,0 @@
/**
* 解决方案类型视图模型
* 用于解决方案列表页标签栏的渲染与排序
*/
export interface SolutionTypeView {
/** 唯一标识符 **/
id: number;
/** 类型名 **/
name: string;
/** 排序字段 **/
sort: number;
}
/**
* 解决方案列表模型
* 用于解决方案列表(/solutions)渲染的数据结构
*/
export interface SolutionListView {
/** 唯一标识符 **/
id: number;
/** 标题 **/
title: string;
/** 摘要 **/
summary: string;
/** 解决方案类型 **/
solution_type: SolutionTypeView;
/** 解决方案封面(图片id) **/
cover: string;
}

20
app/models/views/SolutionView.ts
View File

@ -1,20 +0,0 @@
/**
* 解决方案模型
* 用于解决方案页(/solutions/[slug])渲染的数据结构
*/
export interface SolutionView {
/** 唯一标识符 **/
id: number;
/** 标题 **/
title: string;
/** 摘要 **/
summary: string;
/** 内容 **/
content: string;
/** 创建时间 **/
createAt: string;
}

6
app/pages/about/index.vue
View File

@ -4,7 +4,7 @@
<app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
<div class="content">
<markdown-renderer :content="content.content || ''" />
<markdown-renderer :content="companyProfile.content || ''" />
</div>
<el-divider content-position="left">{{ $t('learn-more') }}</el-divider>
@ -32,9 +32,7 @@
{ label: $t('navigation.home'), to: localePath('/') },
{ label: $t('navigation.about-us') },
];
const { data, pending, error } = await useCompanyProfile();
const content = computed(() => toCompanyProfileView(data.value));
const { data: companyProfile, pending, error } = await useCompanyProfile();
watch(error, (value) => {
if (value) {

16
app/pages/index.vue
View File

@ -1,24 +1,14 @@
<template>
<div class="homepage">
<homepage-carousel :homepage-data="homepageData" :pending="pending" />
<homepage-product-section
:homepage-data="homepageData"
:pending="pending"
/>
<homepage-solution-section
:homepage-data="homepageData"
:pending="pending"
/>
<homepage-carousel :homepage-data="data" :pending="pending" />
<homepage-product-section :homepage-data="data" :pending="pending" />
<homepage-solution-section :homepage-data="data" :pending="pending" />
</div>
</template>
<script setup lang="ts">
const { data, pending, error } = await useHomepage();
const homepageData = computed(() => {
return toHomepageView(data.value);
});
const pageTilte = $t('page-title.homepage');
watch(error, (value) => {

11
app/pages/products/[slug].vue
View File

@ -37,16 +37,7 @@
// 获取路由参数
const id = route.params.slug as string;
const { data, pending, error } = await useProduct(id);
const rawProduct = computed(() => data.value ?? null);
const product = computed(() => {
if (rawProduct.value === null) {
return null;
}
return toProductView(rawProduct.value);
});
const { data: product, pending, error } = await useProduct(id);
const breadcrumbItems = computed(() => [
{ label: $t('navigation.home'), to: localePath('/') },

10
app/pages/products/index.vue
View File

@ -37,7 +37,7 @@
const localePath = useLocalePath();
const { getImageUrl } = useDirectusImage();
const { data, pending, error } = await useProductList();
const { data: products, pending, error } = await useProductList();
const activeNames = ref<string[]>([]);
@ -46,14 +46,6 @@
{ label: $t('navigation.products') },
];
const productsRaw = computed(() => data.value ?? []);
const products = computed(() =>
productsRaw.value.map((item) => toProductListView(item))
);
logger.debug('产品列表数据: ', products.value);
// 按类型分组
const groupedProducts = computed(() => {
const groups: Record<string, { data: ProductListView[]; sort: number }> =

9
app/pages/solutions/[slug].vue
View File

@ -29,14 +29,7 @@
// 获取路由参数
const id = route.params.slug as string;
const { data, pending, error } = await useSolution(id);
const solution = computed(() => {
if (!data.value) {
return null;
}
return toSolutionView(data.value);
});
const { data: solution, pending, error } = await useSolution(id);
const breadcrumbItems = computed(() => [
{ label: $t('navigation.home'), to: localePath('/') },

7
app/pages/solutions/index.vue
View File

@ -52,12 +52,7 @@
{ label: $t('navigation.solutions') },
];
const { data, pending, error } = await useSolutionList();
const solutionsRaw = computed(() => data.value ?? []);
const solutions = computed(() =>
solutionsRaw.value.map((item) => toSolutionListView(item))
);
const { data: solutions, pending, error } = await useSolutionList();
const activeName = ref<string>('all');

6
app/pages/support/contact-us.vue
View File

@ -7,7 +7,7 @@
</div>
<div v-if="!pending" class="page-content">
<markdown-renderer :content="content.content || ''" />
<markdown-renderer :content="contactInfo.content || ''" />
</div>
<div v-else class="loading">
<el-skeleton :rows="5" animated />
@ -22,9 +22,7 @@
{ label: $t('navigation.support'), to: localePath('/support') },
{ label: $t('navigation.contact-info') },
];
const { data, pending, error } = await useContactInfo();
const content = computed(() => toContactInfoView(data.value));
const { data: contactInfo, pending, error } = await useContactInfo();
watch(error, (value) => {
if (value) {

6
app/pages/support/documents.vue
View File

@ -35,11 +35,7 @@
keyword: '',
});
const { data, pending, error } = await useDocumentList();
const documents = computed(
() => data?.value.map((item) => toDocumentListView(item)) ?? []
);
const { data: documents, pending, error } = await useDocumentList();
const productTypeOptions = computed(() => {
const types: DocumentListProductType[] = [];

6
app/pages/support/faq.vue
View File

@ -38,11 +38,7 @@
{ label: $t('navigation.faq') },
];
const { data, pending, error } = await useQuestionList();
const questions = computed(
() => data.value.map((item) => toQuestionListView(item)) ?? null
);
const { data: questions, pending, error } = await useQuestionList();
const productTypeOptions = computed(() => {
const types: QuestionListProductType[] = [];