bx-2502-qr #1
|
@ -0,0 +1,14 @@
|
|||
<script setup lang="ts">
|
||||
const { fetchData } = useApiFetch()
|
||||
const config = useRuntimeConfig()
|
||||
const { data: seo } = await fetchData<Seo[]>(`seo`)
|
||||
import og_img from '/og_img.png'
|
||||
|
||||
useSeoMeta({
|
||||
title: seo.value && seo.value[0].title,
|
||||
ogTitle: seo.value && seo.value[0].title,
|
||||
description: seo.value && seo.value[0].content,
|
||||
ogDescription: seo.value && seo.value[0].content,
|
||||
ogImage: config.public.baseUrl + og_img
|
||||
})
|
||||
</script>
|
|
@ -5,21 +5,10 @@ const imgBase = config.public.imgBase
|
|||
|
||||
import { marked } from 'marked'
|
||||
|
||||
import og_img from '/og_img.png'
|
||||
|
||||
const { data: seo } = await fetchData<Seo[]>(`seo`)
|
||||
const { data: menu_raw, status: menu_status } = await fetchData<Menu[]>(`menu`)
|
||||
const { data: review } = await fetchData<Review[]>(`review`)
|
||||
const { data: calc_data } = await fetchData<CalcItem[]>(`calculator`)
|
||||
|
||||
useSeoMeta({
|
||||
title: seo.value && seo.value[0].title,
|
||||
ogTitle: seo.value && seo.value[0].title,
|
||||
description: seo.value && seo.value[0].content,
|
||||
ogDescription: seo.value && seo.value[0].content,
|
||||
ogImage: config.public.baseUrl + og_img
|
||||
})
|
||||
|
||||
const pages = computed(() => {
|
||||
const menu = menu_raw.value?.find(el => el.type == 1)
|
||||
return (menu?.pages || []).sort((a, b) => a.order - b.order)
|
||||
|
@ -34,14 +23,15 @@ const delivery = computed(() =>
|
|||
|
||||
const setCalcData = (txt: string) => {
|
||||
let c = txt
|
||||
;(calc_data.value || []).map(item => {
|
||||
c = c.replaceAll(`[${item.slug}]`, roubleSign.format(item.base))
|
||||
})
|
||||
; (calc_data.value || []).map(item => {
|
||||
c = c.replaceAll(`[${item.slug}]`, roubleSign.format(item.base))
|
||||
})
|
||||
return marked.parse(c)
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<div>
|
||||
<Seo />
|
||||
<template v-for="page in pages" :key="page.slug">
|
||||
<template v-if="page.slug == 'about'">
|
||||
<div class="siteblock bg-white" :id="page.slug">
|
||||
|
@ -53,42 +43,24 @@ const setCalcData = (txt: string) => {
|
|||
</div>
|
||||
</div>
|
||||
<div class="siteblock-image">
|
||||
<NuxtImg
|
||||
:src="[imgBase, page.image].join('/')"
|
||||
:alt="page.title"
|
||||
title=""
|
||||
format="webp"
|
||||
/>
|
||||
<NuxtImg :src="[imgBase, page.image].join('/')" :alt="page.title" title="" format="webp" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="page.slug == 'review'">
|
||||
<div
|
||||
class="siteblock siteblock_imgbg bg-slate-500"
|
||||
:style="[
|
||||
{ backgroundImage: `url(${[imgBase, page.image].join('/')})` }
|
||||
]"
|
||||
>
|
||||
<NuxtImg
|
||||
:src="[imgBase, page.image].join('/')"
|
||||
:alt="page.title"
|
||||
format="webp"
|
||||
loading="lazy"
|
||||
/>
|
||||
<div class="siteblock siteblock_imgbg bg-slate-500" :style="[
|
||||
{ backgroundImage: `url(${[imgBase, page.image].join('/')})` }
|
||||
]">
|
||||
<NuxtImg :src="[imgBase, page.image].join('/')" :alt="page.title" format="webp" loading="lazy" />
|
||||
</div>
|
||||
<div class="siteblock bg-white">
|
||||
<div class="container" :id="page.slug">
|
||||
<template v-for="item in review?.slice(0, 3)">
|
||||
<div class="review">
|
||||
<div class="review-image">
|
||||
<NuxtImg
|
||||
:src="[imgBase, item.image].join('/')"
|
||||
:alt="item.text"
|
||||
title=""
|
||||
format="webp"
|
||||
loading="lazy"
|
||||
/>
|
||||
<NuxtImg :src="[imgBase, item.image].join('/')" :alt="item.text" title="" format="webp"
|
||||
loading="lazy" />
|
||||
</div>
|
||||
<div class="review-content">
|
||||
{{ item.comment }}
|
||||
|
@ -114,17 +86,10 @@ const setCalcData = (txt: string) => {
|
|||
</div>
|
||||
</template>
|
||||
<template v-if="page.slug == 'more'">
|
||||
<div
|
||||
class="siteblock siteblock_imgbg bg-slate-500"
|
||||
:style="[
|
||||
{ backgroundImage: `url(${[imgBase, page.image].join('/')})` }
|
||||
]"
|
||||
>
|
||||
<NuxtImg
|
||||
:src="[imgBase, page.image].join('/')"
|
||||
format="webp"
|
||||
loading="lazy"
|
||||
/>
|
||||
<div class="siteblock siteblock_imgbg bg-slate-500" :style="[
|
||||
{ backgroundImage: `url(${[imgBase, page.image].join('/')})` }
|
||||
]">
|
||||
<NuxtImg :src="[imgBase, page.image].join('/')" format="webp" loading="lazy" />
|
||||
</div>
|
||||
<div class="siteblock bg-white" :id="page.slug">
|
||||
<div class="container gap-4">
|
||||
|
@ -138,23 +103,12 @@ const setCalcData = (txt: string) => {
|
|||
</div>
|
||||
</template>
|
||||
<template v-if="page.slug == 'delivery'">
|
||||
<div
|
||||
class="siteblock siteblock_imgbg bg-slate-500"
|
||||
:style="[
|
||||
{ backgroundImage: `url(${[imgBase, page.image].join('/')})` }
|
||||
]"
|
||||
>
|
||||
<NuxtImg
|
||||
:src="[imgBase, page.image].join('/')"
|
||||
format="webp"
|
||||
loading="lazy"
|
||||
/>
|
||||
<div class="siteblock siteblock_imgbg bg-slate-500" :style="[
|
||||
{ backgroundImage: `url(${[imgBase, page.image].join('/')})` }
|
||||
]">
|
||||
<NuxtImg :src="[imgBase, page.image].join('/')" format="webp" loading="lazy" />
|
||||
</div>
|
||||
<div
|
||||
class="siteblock bg-white siteblock_content"
|
||||
:id="page.slug"
|
||||
v-if="delivery"
|
||||
>
|
||||
<div class="siteblock bg-white siteblock_content" :id="page.slug" v-if="delivery">
|
||||
<div class="container">
|
||||
<div class="prose col-span-12 xl:col-span-6">
|
||||
<span v-html="delivery[0]"></span>
|
||||
|
|
13
pages/qr.vue
13
pages/qr.vue
|
@ -26,11 +26,14 @@ onMounted(() => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div class="siteblock">
|
||||
<div class="container text-center">
|
||||
<h1 class="siteblock-title">QR-КОД</h1>
|
||||
<div class="col-span-full">
|
||||
<canvas class="border mx-auto" ref="qrCanvas"></canvas>
|
||||
<div>
|
||||
<Seo />
|
||||
<div class="siteblock">
|
||||
<div class="container text-center">
|
||||
<h1 class="siteblock-title">QR-КОД</h1>
|
||||
<div class="col-span-full">
|
||||
<canvas class="border mx-auto" ref="qrCanvas"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue