From 5e14427a13c89d16c8a47da77eda2e4807d5792c Mon Sep 17 00:00:00 2001
From: Kseninia Mikhaylova <k.mikhailova@svs-tech.pro>
Date: Wed, 10 Jul 2024 15:11:39 +0300
Subject: [PATCH] use fetch

---
 components/header.vue | 4 ++--
 error.vue             | 4 ++--
 nuxt.config.ts        | 5 +++++
 pages/[slug].vue      | 7 +++++--
 pages/index.vue       | 2 +-
 types/index.d.ts      | 1 +
 utils/apiFetch.ts     | 3 ++-
 7 files changed, 18 insertions(+), 8 deletions(-)

diff --git a/components/header.vue b/components/header.vue
index bb122bf..31d4f48 100644
--- a/components/header.vue
+++ b/components/header.vue
@@ -1,8 +1,8 @@
 <script setup lang="ts">
 import { apiFetch } from '~/utils/apiFetch';
 
-const { data: menuData } = await apiFetch<ApiMenuType>(`menu/1/?ordering=order`)
-const pagesData = menuData.value ? menuData.value.pages : []
+const { data: menuData } = await apiFetch<ApiMenuType>(`menu/1/`)
+const pagesData = (menuData.value ? menuData.value.pages : []).sort((a, b) => a.order - b.order)
 const route = useRoute()
 </script>
 <template>
diff --git a/error.vue b/error.vue
index 55e048d..2ba9369 100644
--- a/error.vue
+++ b/error.vue
@@ -5,7 +5,7 @@ import { apiFetch } from './utils/apiFetch';
 import type { NuxtError } from '#app'
 import og_img from '/og_img.png'
 
-const { data: seoData } = await apiFetch<ApiKpType>(`kp/2`)
+const { data: seoData } = await apiFetch<ApiKpType>(`kp/2/`)
 useSeoMeta({
     title: seoData.value?.title,
     ogTitle: seoData.value?.title,
@@ -20,7 +20,7 @@ const props = defineProps({
 })
 const route = useRoute()
 if(route.path !== '/404') {
-    navigateTo('/404')
+    // navigateTo('/404')
 }
 </script>
 <template>
diff --git a/nuxt.config.ts b/nuxt.config.ts
index a2e80c4..d45e970 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -42,6 +42,11 @@ export default defineNuxtConfig({
       },
     },
   },
+  vue: {
+    compilerOptions: {
+      isCustomElement: (tag) => ['nobr'].includes(tag),
+    }
+  },
   ssr: true,
   modules: [
     '@nuxtjs/tailwindcss',
diff --git a/pages/[slug].vue b/pages/[slug].vue
index 6112102..59ea8ef 100644
--- a/pages/[slug].vue
+++ b/pages/[slug].vue
@@ -7,7 +7,7 @@ import { marked } from 'marked';
 
 import og_img from '/og_img.png'
 
-const { data: seoData } = await apiFetch<ApiKpType>(`kp/1`)
+const { data: seoData } = await apiFetch<ApiKpType>(`kp/1/`)
 useSeoMeta({
     title: seoData.value?.title,
     ogTitle: seoData.value?.title,
@@ -17,7 +17,7 @@ useSeoMeta({
     // twitterCard: 'summary_large_image',
 })
 const route = useRoute()
-const { data } = await apiFetch<ApiPagesType>(`pages/${route.params.slug}`)
+const { data } = await apiFetch<ApiPagesType>(`pages/${route.params.slug}/`)
 if (!data.value) {
     throw createError({
         statusCode: 404,
@@ -38,6 +38,9 @@ const policyText = computed(() => {
                 <div class="col-span-full prose max-w-full" v-html="policyText" />
             </div>
         </div>
+        <div class="siteblock-image" v-if="data?.image">
+            <NuxtImg :src="[imgBase, data?.image].join('/')" :alt="data.title || 'фоновая картинка'" title="" format="webp" />
+        </div>
         <div class="siteblock siteblock_calc bg-white">
             <Suspense>
                 <CalcModels />
diff --git a/pages/index.vue b/pages/index.vue
index a74436c..4dffb05 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -7,7 +7,7 @@ import { marked } from 'marked';
 
 import og_img from '/og_img.png'
 
-const { data: seoData } = await apiFetch<ApiKpType>(`kp/1`)
+const { data: seoData } = await apiFetch<ApiKpType>(`kp/1/`)
 useSeoMeta({
     title: seoData.value?.title,
     ogTitle: seoData.value?.title,
diff --git a/types/index.d.ts b/types/index.d.ts
index 8c61d6e..be3fce7 100644
--- a/types/index.d.ts
+++ b/types/index.d.ts
@@ -22,6 +22,7 @@ type ApiMenuType = {
 
 type ApiPagesType = {
     id: number
+    order: number
     title: string
     menu_title: string
     slug: string
diff --git a/utils/apiFetch.ts b/utils/apiFetch.ts
index 706c87f..e42ca76 100644
--- a/utils/apiFetch.ts
+++ b/utils/apiFetch.ts
@@ -7,7 +7,8 @@ export async function apiFetch<T>(path: string) {
         baseURL: config.public.baseUrl,
         headers,
         onResponseError({ response }) {
-            console.log(response)
+            console.log(response.status)
+            console.log(response.url)
             window.location.pathname = '/404'
             throw createError({
                 statusCode: 404,