feat: 将解决方案页迁移至directus

- 将/solutions与/solutions/[slug]页现在由Directus作为CMS
- 添加solution页的composable API

app/pages/solutions/[...slug].vue

@@ -25,7 +25,7 @@
             <div class="solution-meta">
               <span class="solution-date">
                 CreatedAt:
-                {{ new Date(solution.createdAt).toLocaleDateString() }}
+                {{ new Date(solution.createAt).toLocaleDateString() }}
               </span>
             </div>
           </div>
@@ -57,23 +57,17 @@
 
 <script setup lang="ts">
   const route = useRoute();
-  const { findOne } = useStrapi();
-  const { getStrapiLocale } = useLocalizations();
-  const strapiLocale = getStrapiLocale();
 
   // 获取路由参数(documentId)
-  const documentId = computed(() => route.params.slug as string);
+  const id = computed(() => route.params.slug as string);
 
-  const { data, pending, error } = useAsyncData(
-    () => `solution-${documentId.value}`,
-    () =>
-      findOne<Solution>('solutions', documentId.value, {
-        populate: '*',
-        locale: strapiLocale,
-      })
-  );
+  const { data, pending, error } = await useSolution(id.value);
 
-  const solution = computed(() => data.value?.data ?? null);
+  console.log('RawData: ', data.value);
+  const process = toSolutionView(data.value);
+  console.log('Processed Solution: ', process);
+
+  const solution = computed(() => toSolutionView(data.value));
 
   watch(error, (value) => {
     if (value) {

app/pages/solutions/index.vue

@@ -21,11 +21,11 @@
           <div class="solution-list">
             <solution-card
               v-for="solution in solutions"
-              :key="solution.documentId"
+              :key="solution.id"
               :title="solution.title"
               :summary="solution.summary || ''"
-              :cover-url="useStrapiMedia(solution?.cover?.url || '')"
-              :document-id="solution.documentId"
+              :cover-url="getImageUrl(solution.cover || '')"
+              :document-id="solution.id.toString()"
             />
           </div>
         </el-tab-pane>
@@ -38,9 +38,9 @@
           <div class="solution-list">
             <solution-card
               v-for="solution in group"
-              :key="solution.documentId"
-              :document-id="solution.documentId"
-              :cover-url="useStrapiMedia(solution?.cover?.url || '')"
+              :key="solution.id"
+              :document-id="solution.id.toString()"
+              :cover-url="getImageUrl(solution.cover || '')"
               :title="solution.title"
               :summary="solution.summary || ''"
             />
@@ -55,31 +55,22 @@
 </template>
 
 <script setup lang="ts">
-  const { find } = useStrapi();
-  const { getStrapiLocale } = useLocalizations();
-  const strapiLocale = getStrapiLocale();
+  const { getImageUrl } = useDirectusImage();
 
-  const { data, pending, error } = useAsyncData('solutions', () =>
-    find<Solution>('solutions', {
-      populate: {
-        cover: {
-          populate: '*',
-        },
-        solution_type: {
-          populate: '*',
-        },
-      },
-      locale: strapiLocale,
-    })
+  const { data, pending, error } = await useSolutionList();
+
+  const solutionsRaw = computed(() => data.value ?? []);
+  const solutions = computed(() =>
+    solutionsRaw.value.map((item) => toSolutionListView(item))
   );
 
   const activeName = ref<string>('all');
 
-  const solutions = computed(() => data.value?.data ?? []);
+  console.log('Processed Data', solutions.value);
 
   // 按类型分组
   const groupedSolutions = computed(() => {
-    const gourps: Record<string, Solution[]> = {};
+    const gourps: Record<string, SolutionListView[]> = {};
     for (const sol of solutions.value) {
       let typeKey = '';
       if (typeof sol.solution_type === 'string') {
@@ -89,7 +80,7 @@
         typeof sol.solution_type === 'object' &&
         'type' in sol.solution_type
       ) {
-        typeKey = sol.solution_type.type || '';
+        typeKey = sol.solution_type || '';
       }
       if (!gourps[typeKey]) gourps[typeKey] = [];
       gourps[typeKey]?.push(sol);