From 31c9e5f49c4f892b19f6aefe6d3403795aafc2aa Mon Sep 17 00:00:00 2001
From: alsaze <veselov@alfabit.com>
Date: Wed, 26 Nov 2025 17:30:06 +0300
Subject: [PATCH] init

---
 composables/useScreen.ts | 12 ++++++++++++
 layouts/default.vue      | 42 +++++++++++++++++++++++++++-------------
 2 files changed, 41 insertions(+), 13 deletions(-)
 create mode 100644 composables/useScreen.ts

diff --git a/composables/useScreen.ts b/composables/useScreen.ts
new file mode 100644
index 0000000..abec122
--- /dev/null
+++ b/composables/useScreen.ts
@@ -0,0 +1,12 @@
+import { useMediaQuery } from '@vueuse/core'
+
+export default function useScreen() {
+  const isMobile = useMediaQuery('(max-width: 1279px)')
+
+  const isDesktop = computed(() => !isMobile.value)
+
+  return {
+    isMobile,
+    isDesktop,
+  }
+}
diff --git a/layouts/default.vue b/layouts/default.vue
index b2dddbb..060d935 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -1,9 +1,15 @@
 <template>
   <div class="layout">
-    <UHeader title="Rental">
-      <UTabs v-model="activeTab" :content="false" :items="tabs" />
-
-      <template #right>
+    <UHeader
+      title="Rental"
+      :toggle="false"
+      :ui="{ left: 'justify-between w-full', container: 'gap-0', right: 'hidden' }"
+    >
+      <template #left>
+        <NuxtLink to="/">
+          Rental
+        </NuxtLink>
+        <UTabs v-model="activeTab" :content="false" :items="tabs" />
         <UColorModeButton />
       </template>
     </UHeader>
@@ -14,40 +20,50 @@
       </UContainer>
     </UMain>
 
-    <UFooter />
+    <UFooter>
+      <div class="flex flex-col md:flex-row justify-between items-center w-full text-sm opacity-70">
+        <div>
+          © {{ new Date().getFullYear() }} Rental. Все права защищены.
+        </div>
+      </div>
+    </UFooter>
   </div>
 </template>
 
 <script setup lang="ts">
 import type { TabsItem } from '@nuxt/ui'
+import useScreen from '~/composables/useScreen'
+
+const { isMobile } = useScreen()
 
 const router = useRouter()
 const route = useRoute()
 
 const tabs = ref<TabsItem[]>([
   {
-    label: 'Главная',
+    label: isMobile.value ? '' : 'Главная',
     icon: 'i-lucide-home',
+    value: 'index',
     route: '/',
   },
   {
-    label: 'Недвижимость',
+    label: isMobile.value ? '' : 'Недвижимость',
     icon: 'i-lucide-building-2',
+    value: 'nedvizhimost',
     route: '/nedvizhimost',
   },
   {
-    label: 'Авто',
+    label: isMobile.value ? '' : 'Авто',
     icon: 'i-lucide-car',
+    value: 'transport',
     route: '/transport',
   },
 ])
 
-const activeTab = ref(tabs.value.findIndex(tab => route.path.startsWith(tab.route)))
+const activeTab = ref(route.path.split('/')[1])
 
 watch(() => activeTab.value, () => {
-  router.push(tabs.value[activeTab?.value]?.route)
+  const tab = tabs.value.find(tab => tab.value === activeTab.value)
+  router.push(tab.route)
 })
 </script>
-
-<style lang="scss">
-</style>