mohadese namavar
39 lines
1.1 KiB
Vue
39 lines
1.1 KiB
Vue
<template>
|
|
<NuxtLayout :name="device" :config="config">
|
|
<main class="blog">
|
|
<BlogCategories v-if="device == 'desktop'" />
|
|
<BlogList />
|
|
<BlogAside />
|
|
</main>
|
|
</NuxtLayout>
|
|
</template>
|
|
|
|
<script setup>
|
|
const config = reactive({
|
|
mobile: { header: { search: true, menu: true }, navigation: false },
|
|
})
|
|
|
|
const { sidebar, device } = inject('service')
|
|
const route = useRoute()
|
|
const { page = 1, ...params } = route.query
|
|
|
|
const { status, data, error } = await useFetch(`/api/posts/${page}`, { params })
|
|
|
|
if (status.value == 'success') {
|
|
sidebar.is = resolveComponent('BlogCategories')
|
|
sidebar.props = { data }
|
|
useSeoMeta(data.value.meta || {})
|
|
provide('data', data.value)
|
|
}
|
|
else throw createError(error.value)
|
|
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.blog {
|
|
@apply w-full mx-auto flex flex-col gap-12 lg:gap-6 py-[1.9rem] lg:pt-12 lg:pb-[7.1rem];
|
|
@apply lg:flex-row lg:px-6 justify-around 2xl:justify-start 2xl:items-start container 2xl:max-w-[120rem];
|
|
@apply min-[1725px]:justify-between;
|
|
}
|
|
</style>
|