feat: directus视图与转换函数

- views: 用于前端渲染的视图模型
- mapper: 用于视图模型转换的转换函数
- utils: 相关工具函数

app/models/mappers/documentMapper.ts

@@ -0,0 +1,29 @@
+/**
+ * 将 Directus 返回的 Document 数据转换为 DocumentView 视图模型
+ *
+ * @param raw: 原始的 Document 数据
+ * @returns 转换后的 DocumentView 对象
+ *
+ * @example
+ * const view = toDocumentView(rawDocument);
+ */
+export function toDocumentView(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,
+    filename: file.filename_download,
+    title: trans.title,
+    url: url,
+    size: file.filesize,
+  };
+}

app/models/mappers/productMapper.ts

@@ -0,0 +1,134 @@
+/**
+ * 将 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: '' };
+
+  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,
+    cover: raw.cover.toString(),
+  };
+}
+
+/**
+ * 将 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: '',
+  };
+
+  return {
+    id: raw.id,
+    key: trans.key,
+    value: raw.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) => {
+      return {
+        id: item.id,
+        image: item.image.toString(),
+        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) => toQuestionView(item));
+
+  const documents = (raw.documents ?? [])
+    .filter(isObject<ProductsProductDocument>)
+    .map((item) => item.product_documents_id)
+    .filter(isObject<ProductDocument>)
+    .map((item) => toDocumentView(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,
+  };
+}

app/models/mappers/questionMapper.ts

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