diff --git a/main_dc/yalarba/easySite/easySite/app/components/BookingModal.vue b/main_dc/yalarba/easySite/easySite/app/components/BookingModal.vue
new file mode 100644
index 0000000..0644545
--- /dev/null
+++ b/main_dc/yalarba/easySite/easySite/app/components/BookingModal.vue
@@ -0,0 +1,31 @@
+<template>
+    <div class="modal-overlay" @click="$emit('close')">
+        <div class="modal-content" @click.stop>
+            <div class="modal-header">
+                <h2 class="modal-title">Бронирование</h2>
+                <button class="modal-close" @click="$emit('close')">✕</button>
+            </div>
+            <div class="modal-body">
+                <!-- Контент модального окна бронирования -->
+                <div class="booking-summary">
+                    <h3>{{ object?.title }}</h3>
+                    <p>{{ object?.city }}, {{ object?.address }}</p>
+                </div>
+                <!-- Форма бронирования -->
+            </div>
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+defineProps<{
+    object: any
+    dates: any
+    guests: string
+}>()
+
+defineEmits<{
+    close: []
+    confirm: [bookingData: any]
+}>()
+</script>
\ No newline at end of file
diff --git a/main_dc/yalarba/easySite/easySite/app/components/ImageGallery.vue b/main_dc/yalarba/easySite/easySite/app/components/ImageGallery.vue
new file mode 100644
index 0000000..5f61e63
--- /dev/null
+++ b/main_dc/yalarba/easySite/easySite/app/components/ImageGallery.vue
@@ -0,0 +1,32 @@
+<template>
+    <div class="gallery-overlay" @click="$emit('close')">
+        <div class="gallery-content" @click.stop>
+            <button class="gallery-close" @click="$emit('close')">✕</button>
+            <img :src="currentImage" :alt="`Image ${currentIndex + 1}`" class="gallery-image" />
+            <button class="gallery-nav prev" @click="prevImage">‹</button>
+            <button class="gallery-nav next" @click="nextImage">›</button>
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+const props = defineProps<{
+    images: string[]
+    initialIndex: number
+}>()
+
+const emit = defineEmits<{
+    close: []
+}>()
+
+const currentIndex = ref(props.initialIndex)
+const currentImage = computed(() => props.images[currentIndex.value])
+
+const nextImage = () => {
+    currentIndex.value = (currentIndex.value + 1) % props.images.length
+}
+
+const prevImage = () => {
+    currentIndex.value = (currentIndex.value - 1 + props.images.length) % props.images.length
+}
+</script>
\ No newline at end of file
diff --git a/main_dc/yalarba/easySite/easySite/app/components/layout/ObjectsNavigation.vue b/main_dc/yalarba/easySite/easySite/app/components/layout/ObjectsNavigation.vue
new file mode 100644
index 0000000..aa0019e
--- /dev/null
+++ b/main_dc/yalarba/easySite/easySite/app/components/layout/ObjectsNavigation.vue
@@ -0,0 +1,117 @@
+<!-- components/layout/ObjectsNavigation.vue -->
+<template>
+    <nav class="objects-navigation">
+        <div class="nav-container">
+            <!-- Основные ссылки -->
+            <div class="nav-links">
+                <NuxtLink to="/objects" class="nav-link" :class="{ active: $route.path === '/objects' }">
+                    🏢 Все объекты
+                </NuxtLink>
+                <NuxtLink to="/objects/my-objects" class="nav-link"
+                    :class="{ active: $route.path === '/objects/my-objects' }">
+                    📝 Мои объекты
+                </NuxtLink>
+                <NuxtLink to="/objects/create" class="nav-link" :class="{ active: $route.path === '/objects/create' }">
+                    ➕ Добавить объект
+                </NuxtLink>
+            </div>
+
+            <!-- Дополнительные действия -->
+            <div class="nav-actions">
+                <NuxtLink to="/" class="nav-action">
+                    🏠 На главную
+                </NuxtLink>
+            </div>
+        </div>
+    </nav>
+</template>
+
+<script setup lang="ts">
+</script>
+
+<style scoped>
+.objects-navigation {
+    background: var(--bg-primary);
+    border-bottom: 1px solid var(--border-light);
+    margin-bottom: 2rem;
+}
+
+.nav-container {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 1rem 0;
+}
+
+.nav-links {
+    display: flex;
+    gap: 1.5rem;
+    align-items: center;
+}
+
+.nav-link {
+    padding: 0.75rem 1.25rem;
+    text-decoration: none;
+    border-radius: var(--radius-lg);
+    font-weight: 500;
+    transition: all 0.3s ease;
+    border: 1px solid transparent;
+    color: var(--text-primary);
+}
+
+.nav-link:hover {
+    background: var(--bg-secondary);
+    color: var(--primary-600);
+    text-decoration: none;
+}
+
+.nav-link.active {
+    background: var(--primary-500);
+    color: var(--text-inverse);
+    border-color: var(--primary-500);
+}
+
+.nav-actions {
+    display: flex;
+    gap: 1rem;
+}
+
+.nav-action {
+    padding: 0.5rem 1rem;
+    text-decoration: none;
+    border-radius: var(--radius-md);
+    font-size: 0.9rem;
+    color: var(--text-secondary);
+    transition: all 0.3s ease;
+}
+
+.nav-action:hover {
+    color: var(--primary-500);
+    text-decoration: none;
+}
+
+/* Адаптивность */
+@media (max-width: 768px) {
+    .nav-container {
+        flex-direction: column;
+        gap: 1rem;
+        padding: 0.75rem 0;
+    }
+
+    .nav-links {
+        flex-wrap: wrap;
+        justify-content: center;
+        gap: 0.5rem;
+    }
+
+    .nav-link {
+        padding: 0.5rem 1rem;
+        font-size: 0.9rem;
+    }
+
+    .nav-actions {
+        width: 100%;
+        justify-content: center;
+    }
+}
+</style>
\ No newline at end of file
diff --git a/main_dc/yalarba/easySite/easySite/app/pages/objects/[id]/edit.vue b/main_dc/yalarba/easySite/easySite/app/pages/objects/[id]/edit.vue
index e3b2099..2ad9a4e 100644
--- a/main_dc/yalarba/easySite/easySite/app/pages/objects/[id]/edit.vue
+++ b/main_dc/yalarba/easySite/easySite/app/pages/objects/[id]/edit.vue
@@ -1,42 +1,50 @@
-<!-- pages/objects/[id]/edit.vue -->
 <template>
-  <div class="min-h-screen bg-gray-50 py-8">
-    <div class="container max-w-4xl">
-      <div class="mb-8">
-        <div class="flex items-center gap-4 mb-2">
-          <NuxtLink 
-            :to="`/objects/${$route.params.id}`"
-            class="btn btn-outline btn-sm"
-          >
-            ← Назад
-          </NuxtLink>
-          <h1 class="text-3xl font-bold">Редактировать объект</h1>
+  <div class="page-wrapper">
+    <Header />
+
+    <main class="edit-object-page">
+      <div class="container max-w-4xl">
+        <!-- Заголовок -->
+        <div class="page-header">
+          <div class="header-content">
+            <div class="header-main">
+              <NuxtLink :to="`/objects/${$route.params.id}`" class="btn btn-outline btn-sm btn-with-icon">
+                ← Назад к объекту
+              </NuxtLink>
+              <h1 class="page-title">Редактировать объект</h1>
+            </div>
+            <p class="page-subtitle">Обновите информацию о вашем объекте</p>
+          </div>
         </div>
-        <p class="text-gray-600">Обновите информацию о вашем объекте</p>
-      </div>
 
-      <div v-if="loading" class="text-center py-12">
-        <div class="animate-spin rounded-full h-12 w-12 border-b-2 border-primary-500 mx-auto"></div>
-        <p class="mt-4 text-gray-600">Загрузка данных объекта...</p>
-      </div>
+        <!-- Загрузка -->
+        <div v-if="loading" class="loading-state">
+          <div class="loading-spinner"></div>
+          <p class="loading-text">Загрузка данных объекта...</p>
+        </div>
 
-      <ObjectForm 
-        v-else-if="object"
-        :object="object"
-        :loading="updating"
-        @submit="handleSubmit"
-        @cancel="handleCancel"
-      />
+        <!-- Форма -->
+        <ObjectForm v-else-if="object" :object="object" :loading="updating" @submit="handleSubmit"
+          @cancel="handleCancel" />
 
-      <div v-else class="text-center py-12">
-        <div class="text-gray-400 text-6xl mb-4">❌</div>
-        <h3 class="text-xl font-semibold mb-2">Объект не найден</h3>
-        <p class="text-gray-600 mb-6">Возможно, объект был удален или у вас нет к нему доступа</p>
-        <NuxtLink to="/objects/my-objects" class="btn btn-primary">
-          Вернуться к моим объектам
-        </NuxtLink>
+        <!-- Объект не найден -->
+        <div v-else class="error-state">
+          <div class="error-icon">❌</div>
+          <h3 class="error-title">Объект не найден</h3>
+          <p class="error-description">Возможно, объект был удален или у вас нет к нему доступа</p>
+          <div class="error-actions">
+            <NuxtLink to="/objects/my-objects" class="btn btn-primary">
+              Вернуться к моим объектам
+            </NuxtLink>
+            <NuxtLink to="/objects" class="btn btn-outline">
+              Все объекты
+            </NuxtLink>
+          </div>
+        </div>
       </div>
-    </div>
+    </main>
+
+    <Footer />
   </div>
 </template>
 
@@ -67,7 +75,7 @@ const mockObject: ObjectData = {
   id: 1,
   title: 'Гостевой дом "У озера"',
   type: 'guest_house',
-  description: 'Уютный гостевой дом на берегу живописного озера в Карелии',
+  description: 'Уютный гостевой дом на берегу живописного озера в Карелии. Идеальное место для отдыха от городской суеты.',
   city: 'Карелия',
   address: 'ул. Озерная, 15',
   price: 2800,
@@ -92,16 +100,16 @@ onMounted(async () => {
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const handleSubmit = async (formData: any) => {
   updating.value = true
-  
+
   try {
     // Имитация обновления
     await new Promise(resolve => setTimeout(resolve, 1000))
-    
+
     console.log('Обновление объекта:', {
       id: parseInt(route.params.id as string),
       ...formData
     })
-    
+
     alert('Объект успешно обновлен!')
     await navigateTo(`/objects/${route.params.id}`)
   } catch (error) {
@@ -116,4 +124,149 @@ const handleCancel = () => {
   const objectId = route.params.id
   navigateTo(`/objects/${objectId}`)
 }
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+.edit-object-page {
+  padding: var(--space-xl) 0;
+  min-height: calc(100vh - 160px);
+  background: var(--bg-secondary);
+}
+
+.page-header {
+  background: var(--bg-primary);
+  border-radius: var(--radius-lg);
+  padding: var(--space-xl);
+  margin-bottom: var(--space-lg);
+  box-shadow: var(--shadow-sm);
+  border: 1px solid var(--border-light);
+}
+
+.header-content {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-md);
+}
+
+.header-main {
+  display: flex;
+  align-items: center;
+  gap: var(--space-lg);
+}
+
+.page-title {
+  font-family: var(--font-heading);
+  font-size: var(--text-3xl);
+  font-weight: var(--font-bold);
+  color: var(--text-primary);
+  margin: 0;
+}
+
+.page-subtitle {
+  font-size: var(--text-lg);
+  color: var(--text-secondary);
+  margin: 0;
+}
+
+.loading-state {
+  text-align: center;
+  padding: var(--space-2xl);
+  background: var(--bg-primary);
+  border-radius: var(--radius-lg);
+  border: 1px solid var(--border-light);
+}
+
+.loading-spinner {
+  width: 3rem;
+  height: 3rem;
+  border: 3px solid var(--border-light);
+  border-top: 3px solid var(--primary-500);
+  border-radius: 50%;
+  animation: spin 1s linear infinite;
+  margin: 0 auto var(--space-md);
+}
+
+.loading-text {
+  color: var(--text-secondary);
+  font-size: var(--text-lg);
+}
+
+.error-state {
+  text-align: center;
+  padding: var(--space-2xl);
+  background: var(--bg-primary);
+  border-radius: var(--radius-lg);
+  border: 1px solid var(--border-light);
+}
+
+.error-icon {
+  font-size: 4rem;
+  margin-bottom: var(--space-lg);
+  opacity: 0.7;
+}
+
+.error-title {
+  font-family: var(--font-heading);
+  font-size: var(--text-xl);
+  font-weight: var(--font-semibold);
+  color: var(--text-primary);
+  margin-bottom: var(--space-sm);
+}
+
+.error-description {
+  color: var(--text-secondary);
+  margin-bottom: var(--space-lg);
+  max-width: 400px;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.error-actions {
+  display: flex;
+  gap: var(--space-sm);
+  justify-content: center;
+  flex-wrap: wrap;
+}
+
+@keyframes spin {
+  0% {
+    transform: rotate(0deg);
+  }
+
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+/* Адаптивность */
+@media (max-width: 768px) {
+  .header-main {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: var(--space-md);
+  }
+
+  .page-title {
+    font-size: var(--text-2xl);
+  }
+
+  .error-actions {
+    flex-direction: column;
+    align-items: center;
+  }
+
+  .error-actions .btn {
+    min-width: 200px;
+  }
+}
+
+@media (max-width: 480px) {
+  .page-header {
+    padding: var(--space-lg);
+  }
+
+  .error-state {
+    padding: var(--space-xl);
+  }
+}
+</style>
\ No newline at end of file
diff --git a/main_dc/yalarba/easySite/easySite/app/pages/objects/[id]/index.vue b/main_dc/yalarba/easySite/easySite/app/pages/objects/[id]/index.vue
index a10c01f..5a9caec 100644
--- a/main_dc/yalarba/easySite/easySite/app/pages/objects/[id]/index.vue
+++ b/main_dc/yalarba/easySite/easySite/app/pages/objects/[id]/index.vue
@@ -1,211 +1,986 @@
-<!-- pages/objects/index.vue -->
 <template>
-  <div class="min-h-screen bg-gray-50 py-8">
-    <div class="container">
-      <!-- Заголовок и кнопка добавления -->
-      <div class="flex justify-between items-center mb-8">
-        <div>
-          <h1 class="text-3xl font-bold">Все объекты</h1>
-          <p class="text-gray-600 mt-2">База объектов для путешествий</p>
-        </div>
-        <NuxtLink to="/objects/create" class="btn btn-primary">
-          Добавить объект
-        </NuxtLink>
-      </div>
+  <div class="page-wrapper">
+    <Header />
 
-      <!-- Фильтры поиска -->
-      <div class="search-filters mb-8">
-        <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-4">
-          <div class="form-group">
-            <label class="form-label">Тип объекта</label>
-            <select v-model="filters.type" class="form-select">
-              <option value="">Все типы</option>
-              <option value="hotel">Гостиница</option>
-              <option value="sanatorium">Санаторий</option>
-              <option value="tour">Тур</option>
-              <option value="restaurant">Ресторан</option>
-            </select>
-          </div>
-          <div class="form-group">
-            <label class="form-label">Город</label>
-            <input 
-              v-model="filters.city" 
-              type="text" 
-              class="form-input" 
-              placeholder="Введите город"
-            >
-          </div>
-          <div class="form-group">
-            <label class="form-label">Цена до</label>
-            <input 
-              v-model="filters.maxPrice" 
-              type="number" 
-              class="form-input" 
-              placeholder="Макс. цена"
-            >
+    <main class="object-page">
+      <div class="container max-w-6xl">
+        <!-- Хлебные крошки -->
+        <nav class="breadcrumbs">
+          <NuxtLink to="/objects" class="breadcrumb-link">Все объекты</NuxtLink>
+          <span class="breadcrumb-separator">/</span>
+          <span class="breadcrumb-current">{{ object?.title }}</span>
+        </nav>
+
+        <!-- Заголовок и действия -->
+        <div class="page-header">
+          <div class="header-content">
+            <div class="header-text">
+              <div class="object-meta">
+                <span class="object-type">{{ getTypeLabel(object?.type) }}</span>
+                <div class="rating">
+                  <div class="rating-stars">
+                    <span v-for="star in 5" :key="star" class="rating-star"
+                      :class="{ empty: star > Math.round(object?.rating || 0) }">
+                      ★
+                    </span>
+                  </div>
+                  <span class="rating-value">{{ object?.rating }}</span>
+                  <span class="reviews-count">({{ object?.reviewsCount }} отзывов)</span>
+                </div>
+              </div>
+              <h1 class="page-title">{{ object?.title }}</h1>
+              <div class="object-location">
+                <span class="location-icon">📍</span>
+                {{ object?.city }}, {{ object?.address }}
+              </div>
+            </div>
+            <div class="header-actions">
+              <div class="price-section">
+                <div class="price">{{ formatPrice(object?.price) }}</div>
+                <div class="price-period">за ночь</div>
+              </div>
+              <div class="action-buttons">
+                <button class="btn btn-primary btn-large" @click="showBookingModal = true">
+                  Забронировать
+                </button>
+                <button class="btn btn-outline btn-with-icon">
+                  <span>❤️</span>
+                  В избранное
+                </button>
+              </div>
+            </div>
           </div>
         </div>
-        <div class="flex gap-4">
-          <div class="form-group flex-1">
-            <input 
-              v-model="filters.search" 
-              type="text" 
-              class="form-input"
-              placeholder="Поиск по названию, городу или описанию..."
-              @keyup.enter="searchObjects"
-            >
+
+        <!-- Галерея изображений -->
+        <div class="gallery-section">
+          <div class="main-image">
+            <img :src="object?.images[0]" :alt="object?.title" class="gallery-image" @click="openGallery(0)" />
+          </div>
+          <div class="thumbnails" v-if="object?.images.length > 1">
+            <div v-for="(image, index) in object?.images.slice(1, 5)" :key="index" class="thumbnail"
+              @click="openGallery(index + 1)">
+              <img :src="image" :alt="`${object?.title} - фото ${index + 2}`" />
+              <div v-if="index === 3 && object.images.length > 5" class="more-images">
+                +{{ object.images.length - 5 }}
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <!-- Основной контент -->
+        <div class="content-grid">
+          <!-- Информация об объекте -->
+          <div class="content-main">
+            <!-- Описание -->
+            <section class="content-section">
+              <h2 class="section-title">Описание</h2>
+              <p class="object-description">{{ object?.description }}</p>
+            </section>
+
+            <!-- Удобства -->
+            <section class="content-section">
+              <h2 class="section-title">Удобства</h2>
+              <div class="amenities-grid">
+                <div v-for="amenity in object?.amenities" :key="amenity" class="amenity-item">
+                  <span class="amenity-icon">✅</span>
+                  <span class="amenity-text">{{ amenity }}</span>
+                </div>
+              </div>
+            </section>
+
+            <!-- Контакты -->
+            <section class="content-section">
+              <h2 class="section-title">Контакты</h2>
+              <div class="contact-info">
+                <div class="contact-item">
+                  <span class="contact-icon">📞</span>
+                  <a :href="`tel:${object?.contact.phone}`" class="contact-link">
+                    {{ object?.contact.phone }}
+                  </a>
+                </div>
+                <div class="contact-item">
+                  <span class="contact-icon">✉️</span>
+                  <a :href="`mailto:${object?.contact.email}`" class="contact-link">
+                    {{ object?.contact.email }}
+                  </a>
+                </div>
+                <div class="contact-item">
+                  <span class="contact-icon">📍</span>
+                  <span class="contact-text">{{ object?.address }}, {{ object?.city }}</span>
+                </div>
+              </div>
+            </section>
+
+            <!-- Отзывы -->
+            <section class="content-section" v-if="reviews.length > 0">
+              <div class="section-header">
+                <h2 class="section-title">Отзывы</h2>
+                <div class="reviews-summary">
+                  <div class="average-rating">{{ object?.rating }}</div>
+                  <div class="reviews-stats">
+                    <div class="rating-stars small">
+                      <span v-for="star in 5" :key="star" class="rating-star"
+                        :class="{ empty: star > Math.round(object?.rating || 0) }">
+                        ★
+                      </span>
+                    </div>
+                    <div class="reviews-count">{{ object?.reviewsCount }} отзывов</div>
+                  </div>
+                </div>
+              </div>
+
+              <div class="reviews-list">
+                <div v-for="review in reviews" :key="review.id" class="review-card">
+                  <div class="review-header">
+                    <div class="reviewer-info">
+                      <div class="reviewer-avatar">
+                        {{ review.author.name.charAt(0) }}
+                      </div>
+                      <div class="reviewer-details">
+                        <div class="reviewer-name">{{ review.author.name }}</div>
+                        <div class="review-date">{{ formatDate(review.date) }}</div>
+                      </div>
+                    </div>
+                    <div class="review-rating">
+                      <div class="rating-stars small">
+                        <span v-for="star in 5" :key="star" class="rating-star"
+                          :class="{ empty: star > review.rating }">
+                          ★
+                        </span>
+                      </div>
+                    </div>
+                  </div>
+                  <p class="review-text">{{ review.text }}</p>
+                </div>
+              </div>
+            </section>
+          </div>
+
+          <!-- Боковая панель -->
+          <div class="content-sidebar">
+            <!-- Блок бронирования -->
+            <div class="booking-card card">
+              <div class="card-header">
+                <h3 class="card-title">Бронирование</h3>
+                <div class="price-info">
+                  <span class="price-large">{{ formatPrice(object?.price) }}</span>
+                  <span class="price-period">за ночь</span>
+                </div>
+              </div>
+              <div class="card-body">
+                <div class="booking-form">
+                  <div class="form-group">
+                    <label class="form-label">Даты</label>
+                    <div class="date-inputs">
+                      <input type="date" v-model="bookingDates.checkIn" class="form-input" placeholder="Заезд" />
+                      <input type="date" v-model="bookingDates.checkOut" class="form-input" placeholder="Выезд" />
+                    </div>
+                  </div>
+                  <div class="form-group">
+                    <label class="form-label">Гости</label>
+                    <select v-model="bookingGuests" class="form-select">
+                      <option value="1">1 гость</option>
+                      <option value="2">2 гостя</option>
+                      <option value="3">3 гостя</option>
+                      <option value="4">4 гостя</option>
+                    </select>
+                  </div>
+                  <button class="btn btn-primary btn-large" @click="showBookingModal = true"
+                    :disabled="!bookingDates.checkIn || !bookingDates.checkOut">
+                    Забронировать
+                  </button>
+                </div>
+              </div>
+            </div>
+
+            <!-- Контактная информация -->
+            <div class="contact-card card">
+              <div class="card-header">
+                <h3 class="card-title">Контактная информация</h3>
+              </div>
+              <div class="card-body">
+                <div class="contact-actions">
+                  <a :href="`tel:${object?.contact.phone}`" class="btn btn-outline btn-with-icon">
+                    <span>📞</span>
+                    Позвонить
+                  </a>
+                  <a :href="`mailto:${object?.contact.email}`" class="btn btn-outline btn-with-icon">
+                    <span>✉️</span>
+                    Написать
+                  </a>
+                </div>
+              </div>
+            </div>
+
+            <!-- Действия владельца -->
+            <div v-if="isOwner" class="owner-actions card">
+              <div class="card-header">
+                <h3 class="card-title">Управление объектом</h3>
+              </div>
+              <div class="card-body">
+                <div class="action-buttons">
+                  <NuxtLink :to="`/objects/${object?.id}/edit`" class="btn btn-outline btn-with-icon">
+                    <span>✏️</span>
+                    Редактировать
+                  </NuxtLink>
+                  <button @click="toggleObjectStatus" class="btn btn-outline btn-with-icon"
+                    :class="{ 'btn-primary': !object?.isActive }">
+                    <span>{{ object?.isActive ? '⏸️' : '▶️' }}</span>
+                    {{ object?.isActive ? 'Деактивировать' : 'Активировать' }}
+                  </button>
+                </div>
+              </div>
+            </div>
           </div>
-          <button class="btn btn-primary" @click="searchObjects">
-            Найти
-          </button>
-          <button class="btn btn-outline" @click="resetSearch">
-            Сброс
-          </button>
         </div>
       </div>
+    </main>
 
-      <!-- Быстрые ссылки -->
-      <div class="flex gap-4 mb-6">
-        <NuxtLink to="/objects/my-objects" class="btn btn-outline">
-          📝 Мои объекты
-        </NuxtLink>
-        <NuxtLink to="/objects/create" class="btn btn-outline">
-          ➕ Добавить объект
-        </NuxtLink>
-      </div>
+    <Footer />
 
-      <!-- Результаты поиска -->
-      <div v-if="loading" class="text-center py-12">
-        <div class="animate-spin rounded-full h-12 w-12 border-b-2 border-primary-500 mx-auto"></div>
-        <p class="mt-4 text-gray-600">Загрузка объектов...</p>
-      </div>
+    <!-- Модальное окно бронирования -->
+    <BookingModal v-if="showBookingModal" :object="object" :dates="bookingDates" :guests="bookingGuests"
+      @close="showBookingModal = false" @confirm="handleBooking" />
 
-      <div v-else-if="objects.length === 0" class="text-center py-12">
-        <div class="text-gray-400 text-6xl mb-4">🏢</div>
-        <h3 class="text-xl font-semibold mb-2">Объекты не найдены</h3>
-        <p class="text-gray-600 mb-6">Попробуйте изменить поисковый запрос или добавьте первый объект</p>
-        <NuxtLink to="/objects/create" class="btn btn-primary">
-          Добавить первый объект
-        </NuxtLink>
-      </div>
-
-      <div v-else class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
-        <ObjectCard 
-          v-for="object in objects"
-          :key="object.id"
-          :object="object"
-          @click="navigateToObject(object.id)"
-        />
-      </div>
-    </div>
+    <!-- Галерея изображений -->
+    <ImageGallery v-if="showGallery" :images="object?.images || []" :initial-index="galleryIndex"
+      @close="showGallery = false" />
   </div>
 </template>
 
 <script setup lang="ts">
-interface ObjectItem {
+interface ObjectData {
   id: number
   title: string
   type: string
+  description: string
   city: string
+  address: string
   price: number
   rating: number
-  image: string
-  description: string
+  reviewsCount: number
+  images: string[]
+  amenities: string[]
+  contact: {
+    phone: string
+    email: string
+  }
   isActive: boolean
+  ownerId: number
 }
 
-// Мок-данные
-const mockObjects: ObjectItem[] = [
+interface Review {
+  id: number
+  author: {
+    name: string
+    avatar?: string
+  }
+  rating: number
+  text: string
+  date: string
+}
+
+// Route и состояние
+const route = useRoute()
+const object = ref<ObjectData | null>(null)
+const reviews = ref<Review[]>([])
+const loading = ref(true)
+const showBookingModal = ref(false)
+const showGallery = ref(false)
+const galleryIndex = ref(0)
+const isOwner = ref(false)
+
+// Данные бронирования
+const bookingDates = ref({
+  checkIn: '',
+  checkOut: ''
+})
+const bookingGuests = ref('2')
+
+// Мок-данные объекта
+const mockObject: ObjectData = {
+  id: parseInt(route.params.id as string),
+  title: 'Гостевой дом "У озера"',
+  type: 'guest_house',
+  description: 'Уютный гостевой дом на берегу живописного озера в Карелии. Идеальное место для отдыха от городской суеты. Предлагаем комфортабельные номера с видом на озеро, домашнюю кухню и множество развлечений на природе.',
+  city: 'Карелия',
+  address: 'ул. Озерная, 15',
+  price: 2800,
+  rating: 4.8,
+  reviewsCount: 24,
+  images: [
+    '/images/objects/lake-house-1.jpg',
+    '/images/objects/lake-house-2.jpg',
+    '/images/objects/lake-house-3.jpg',
+    '/images/objects/lake-house-4.jpg',
+    '/images/objects/lake-house-5.jpg'
+  ],
+  amenities: ['Wi-Fi', 'Парковка', 'Завтрак', 'Баня', 'Прокат велосипедов', 'Рыбалка', 'Камин'],
+  contact: {
+    phone: '+7 (911) 123-45-67',
+    email: 'lakehouse@example.com'
+  },
+  isActive: true,
+  ownerId: 1
+}
+
+// Мок-отзывы
+const mockReviews: Review[] = [
   {
     id: 1,
-    title: 'Горный отель "Эдельвейс"',
-    type: 'hotel',
-    city: 'Сочи',
-    price: 4500,
-    rating: 4.8,
-    image: '/images/hotels/edelweiss.jpg',
-    description: 'Комфортабельный отель в горах с видом на море',
-    isActive: true
+    author: { name: 'Анна Петрова' },
+    rating: 5,
+    text: 'Прекрасное место для отдыха! Очень уютные номера, вкусные завтраки и великолепный вид на озеро. Обязательно вернемся снова.',
+    date: '2024-01-15'
   },
   {
     id: 2,
-    title: 'Тур по Алтаю',
-    type: 'tour',
-    city: 'Горно-Алтайск',
-    price: 12500,
-    rating: 4.9,
-    image: '/images/tours/altai.jpg',
-    description: '7-дневный тур по самым живописным местам Алтая',
-    isActive: true
-  },
-  {
-    id: 3,
-    title: 'Санаторий "Здоровье"',
-    type: 'sanatorium',
-    city: 'Кисловодск',
-    price: 3200,
-    rating: 4.6,
-    image: '/images/sanatoriums/health.jpg',
-    description: 'Лечебно-оздоровительный комплекс с минеральными водами',
-    isActive: true
+    author: { name: 'Иван Сидоров' },
+    rating: 4,
+    text: 'Отличный гостевой дом, все понравилось. Особенно порадовала баня и рыбалка. Персонал очень внимательный и доброжелательный.',
+    date: '2024-01-10'
   }
 ]
 
-const objects = ref<ObjectItem[]>(mockObjects)
-const loading = ref(false)
+// Загрузка данных
+onMounted(async () => {
+  loading.value = true
+  try {
+    // Имитация загрузки данных
+    await new Promise(resolve => setTimeout(resolve, 800))
+    object.value = mockObject
+    reviews.value = mockReviews
 
-const filters = ref({
-  search: '',
-  type: '',
-  city: '',
-  maxPrice: null as number | null
+    // Проверка владельца (в реальном приложении - по ID пользователя)
+    isOwner.value = object.value.ownerId === 1
+
+    // SEO
+    useSeoMeta({
+      title: `${object.value.title} - EasySite`,
+      description: object.value.description,
+      ogTitle: object.value.title,
+      ogDescription: object.value.description,
+      ogImage: object.value.images[0]
+    })
+  } catch (error) {
+    console.error('Error loading object:', error)
+    showError({ statusCode: 404, statusMessage: 'Объект не найден' })
+  } finally {
+    loading.value = false
+  }
 })
 
-const searchObjects = async () => {
-  loading.value = true
-  // Имитация загрузки
-  await new Promise(resolve => setTimeout(resolve, 500))
-  
-  let filtered = [...mockObjects]
-  
-  if (filters.value.search) {
-    const search = filters.value.search.toLowerCase()
-    filtered = filtered.filter(obj => 
-      obj.title.toLowerCase().includes(search) ||
-      obj.city.toLowerCase().includes(search) ||
-      obj.description.toLowerCase().includes(search)
-    )
+// Методы
+const getTypeLabel = (type: string | undefined) => {
+  const types: Record<string, string> = {
+    hotel: '🏨 Гостиница',
+    sanatorium: '🏥 Санаторий',
+    guest_house: '🏡 Гостевой дом',
+    tour: '🧳 Тур',
+    restaurant: '🍴 Ресторан'
   }
-  
-  if (filters.value.type) {
-    filtered = filtered.filter(obj => obj.type === filters.value.type)
-  }
-  
-  if (filters.value.city) {
-    filtered = filtered.filter(obj => 
-      obj.city.toLowerCase().includes(filters.value.city.toLowerCase())
-    )
-  }
-  
-  if (filters.value.maxPrice) {
-    filtered = filtered.filter(obj => obj.price <= filters.value.maxPrice!)
-  }
-  
-  objects.value = filtered
-  loading.value = false
+  return types[type || ''] || type
 }
 
-const resetSearch = async () => {
-  filters.value = {
-    search: '',
-    type: '',
-    city: '',
-    maxPrice: null
-  }
-  objects.value = mockObjects
+const formatPrice = (price: number | undefined) => {
+  if (!price) return '0 ₽'
+  return new Intl.NumberFormat('ru-RU', {
+    style: 'currency',
+    currency: 'RUB',
+    minimumFractionDigits: 0
+  }).format(price)
 }
 
-const navigateToObject = (id: number) => {
-  navigateTo(`/objects/${id}`)
+const formatDate = (dateString: string) => {
+  return new Date(dateString).toLocaleDateString('ru-RU', {
+    day: 'numeric',
+    month: 'long',
+    year: 'numeric'
+  })
 }
-</script>
\ No newline at end of file
+
+const openGallery = (index: number) => {
+  galleryIndex.value = index
+  showGallery.value = true
+}
+
+const toggleObjectStatus = async () => {
+  if (!object.value) return
+
+  object.value.isActive = !object.value.isActive
+  // В реальном приложении здесь был бы API-запрос
+}
+
+const handleBooking = (bookingData: any) => {
+  console.log('Booking confirmed:', bookingData)
+  showBookingModal.value = false
+  // Здесь обработка бронирования
+}
+</script>
+
+<style scoped>
+.object-page {
+  padding: var(--space-xl) 0;
+  min-height: calc(100vh - 160px);
+  background: var(--bg-secondary);
+}
+
+.breadcrumbs {
+  display: flex;
+  align-items: center;
+  gap: var(--space-xs);
+  margin-bottom: var(--space-lg);
+  font-size: var(--text-sm);
+  color: var(--text-tertiary);
+}
+
+.breadcrumb-link {
+  color: var(--primary-500);
+  text-decoration: none;
+  transition: color 0.3s ease;
+}
+
+.breadcrumb-link:hover {
+  color: var(--primary-600);
+  text-decoration: underline;
+}
+
+.breadcrumb-separator {
+  color: var(--text-tertiary);
+}
+
+.breadcrumb-current {
+  color: var(--text-primary);
+  font-weight: var(--font-medium);
+}
+
+.page-header {
+  background: var(--bg-primary);
+  border-radius: var(--radius-lg);
+  padding: var(--space-xl);
+  margin-bottom: var(--space-lg);
+  box-shadow: var(--shadow-sm);
+  border: 1px solid var(--border-light);
+}
+
+.header-content {
+  display: grid;
+  grid-template-columns: 1fr auto;
+  gap: var(--space-xl);
+  align-items: flex-start;
+}
+
+.header-text {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-sm);
+}
+
+.object-meta {
+  display: flex;
+  align-items: center;
+  gap: var(--space-lg);
+  margin-bottom: var(--space-sm);
+}
+
+.object-type {
+  padding: var(--space-xs) var(--space-sm);
+  background: var(--primary-100);
+  color: var(--primary-700);
+  border-radius: var(--radius-sm);
+  font-size: var(--text-sm);
+  font-weight: var(--font-medium);
+}
+
+.rating {
+  display: flex;
+  align-items: center;
+  gap: var(--space-xs);
+}
+
+.rating-stars {
+  display: flex;
+  gap: 2px;
+}
+
+.rating-star {
+  color: var(--secondary-400);
+  font-size: var(--text-lg);
+}
+
+.rating-star.empty {
+  color: var(--gray-300);
+}
+
+.rating-stars.small .rating-star {
+  font-size: var(--text-sm);
+}
+
+.rating-value {
+  font-weight: var(--font-semibold);
+  color: var(--text-primary);
+}
+
+.reviews-count {
+  font-size: var(--text-sm);
+  color: var(--text-tertiary);
+}
+
+.page-title {
+  font-family: var(--font-heading);
+  font-size: var(--text-4xl);
+  font-weight: var(--font-bold);
+  color: var(--text-primary);
+  margin: 0;
+  line-height: 1.2;
+}
+
+.object-location {
+  display: flex;
+  align-items: center;
+  gap: var(--space-xs);
+  font-size: var(--text-lg);
+  color: var(--text-secondary);
+}
+
+.location-icon {
+  font-size: var(--text-xl);
+}
+
+.header-actions {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-lg);
+  min-width: 280px;
+}
+
+.price-section {
+  text-align: center;
+  padding: var(--space-lg);
+  background: var(--bg-secondary);
+  border-radius: var(--radius-lg);
+  border: 1px solid var(--border-light);
+}
+
+.price {
+  font-family: var(--font-heading);
+  font-size: var(--text-3xl);
+  font-weight: var(--font-bold);
+  color: var(--primary-600);
+  line-height: 1;
+}
+
+.price-large {
+  font-family: var(--font-heading);
+  font-size: var(--text-2xl);
+  font-weight: var(--font-bold);
+  color: var(--primary-600);
+}
+
+.price-period {
+  font-size: var(--text-sm);
+  color: var(--text-tertiary);
+  margin-top: var(--space-xs);
+}
+
+.action-buttons {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-sm);
+}
+
+/* Галерея */
+.gallery-section {
+  display: grid;
+  grid-template-columns: 2fr 1fr;
+  gap: var(--space-sm);
+  margin-bottom: var(--space-xl);
+  height: 400px;
+}
+
+.main-image {
+  border-radius: var(--radius-lg);
+  overflow: hidden;
+  height: 100%;
+}
+
+.gallery-image {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  cursor: pointer;
+  transition: transform 0.3s ease;
+}
+
+.gallery-image:hover {
+  transform: scale(1.02);
+}
+
+.thumbnails {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: var(--space-sm);
+  height: 100%;
+}
+
+.thumbnail {
+  position: relative;
+  border-radius: var(--radius-md);
+  overflow: hidden;
+  cursor: pointer;
+  height: calc(50% - var(--space-sm) / 2);
+}
+
+.thumbnail img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  transition: transform 0.3s ease;
+}
+
+.thumbnail:hover img {
+  transform: scale(1.05);
+}
+
+.more-images {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.7);
+  color: var(--text-inverse);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-weight: var(--font-bold);
+  font-size: var(--text-lg);
+}
+
+/* Основной контент */
+.content-grid {
+  display: grid;
+  grid-template-columns: 2fr 1fr;
+  gap: var(--space-xl);
+  align-items: start;
+}
+
+.content-main {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-xl);
+}
+
+.content-section {
+  background: var(--bg-primary);
+  border-radius: var(--radius-lg);
+  padding: var(--space-xl);
+  box-shadow: var(--shadow-sm);
+  border: 1px solid var(--border-light);
+}
+
+.section-title {
+  font-family: var(--font-heading);
+  font-size: var(--text-xl);
+  font-weight: var(--font-semibold);
+  color: var(--text-primary);
+  margin-bottom: var(--space-lg);
+}
+
+.section-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  margin-bottom: var(--space-lg);
+}
+
+.reviews-summary {
+  display: flex;
+  align-items: center;
+  gap: var(--space-md);
+}
+
+.average-rating {
+  font-family: var(--font-heading);
+  font-size: var(--text-3xl);
+  font-weight: var(--font-bold);
+  color: var(--text-primary);
+}
+
+.reviews-stats {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-xs);
+}
+
+.object-description {
+  font-size: var(--text-lg);
+  line-height: var(--leading-relaxed);
+  color: var(--text-secondary);
+  margin: 0;
+}
+
+.amenities-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+  gap: var(--space-md);
+}
+
+.amenity-item {
+  display: flex;
+  align-items: center;
+  gap: var(--space-sm);
+  padding: var(--space-sm);
+  background: var(--bg-secondary);
+  border-radius: var(--radius-md);
+}
+
+.amenity-icon {
+  font-size: var(--text-lg);
+}
+
+.amenity-text {
+  font-weight: var(--font-medium);
+  color: var(--text-primary);
+}
+
+.contact-info {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-md);
+}
+
+.contact-item {
+  display: flex;
+  align-items: center;
+  gap: var(--space-sm);
+}
+
+.contact-icon {
+  font-size: var(--text-lg);
+  width: 1.5rem;
+}
+
+.contact-link {
+  color: var(--primary-600);
+  text-decoration: none;
+  transition: color 0.3s ease;
+}
+
+.contact-link:hover {
+  color: var(--primary-700);
+  text-decoration: underline;
+}
+
+.contact-text {
+  color: var(--text-primary);
+}
+
+.reviews-list {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-lg);
+}
+
+.review-card {
+  padding: var(--space-lg);
+  background: var(--bg-secondary);
+  border-radius: var(--radius-lg);
+  border: 1px solid var(--border-light);
+}
+
+.review-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  margin-bottom: var(--space-md);
+}
+
+.reviewer-info {
+  display: flex;
+  align-items: center;
+  gap: var(--space-sm);
+}
+
+.reviewer-avatar {
+  width: 3rem;
+  height: 3rem;
+  background: var(--primary-500);
+  color: var(--text-inverse);
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-weight: var(--font-bold);
+  font-size: var(--text-lg);
+}
+
+.reviewer-details {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-xs);
+}
+
+.reviewer-name {
+  font-weight: var(--font-semibold);
+  color: var(--text-primary);
+}
+
+.review-date {
+  font-size: var(--text-sm);
+  color: var(--text-tertiary);
+}
+
+.review-rating {
+  display: flex;
+  align-items: center;
+  gap: var(--space-xs);
+}
+
+.review-text {
+  line-height: var(--leading-relaxed);
+  color: var(--text-secondary);
+  margin: 0;
+}
+
+/* Боковая панель */
+.content-sidebar {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-lg);
+  position: sticky;
+  top: var(--space-xl);
+}
+
+.booking-card .card-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: var(--space-lg);
+}
+
+.card-title {
+  font-family: var(--font-heading);
+  font-size: var(--text-lg);
+  font-weight: var(--font-semibold);
+  color: var(--text-primary);
+  margin: 0;
+}
+
+.booking-form {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-lg);
+}
+
+.date-inputs {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: var(--space-sm);
+}
+
+.contact-actions {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-sm);
+}
+
+.owner-actions .action-buttons {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-sm);
+}
+
+/* Адаптивность */
+@media (max-width: 1024px) {
+  .content-grid {
+    grid-template-columns: 1fr;
+    gap: var(--space-lg);
+  }
+
+  .content-sidebar {
+    position: static;
+  }
+
+  .gallery-section {
+    height: 300px;
+  }
+}
+
+@media (max-width: 768px) {
+  .header-content {
+    grid-template-columns: 1fr;
+    gap: var(--space-lg);
+  }
+
+  .header-actions {
+    min-width: auto;
+  }
+
+  .gallery-section {
+    grid-template-columns: 1fr;
+    height: auto;
+  }
+
+  .thumbnails {
+    grid-template-columns: repeat(4, 1fr);
+    height: 100px;
+  }
+
+  .thumbnail {
+    height: 100px;
+  }
+
+  .page-title {
+    font-size: var(--text-2xl);
+  }
+
+  .content-section {
+    padding: var(--space-lg);
+  }
+
+  .section-header {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: var(--space-md);
+  }
+
+  .amenities-grid {
+    grid-template-columns: 1fr;
+  }
+}
+
+@media (max-width: 480px) {
+  .page-header {
+    padding: var(--space-lg);
+  }
+
+  .object-meta {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: var(--space-sm);
+  }
+
+  .gallery-section {
+    height: auto;
+  }
+
+  .thumbnails {
+    grid-template-columns: repeat(2, 1fr);
+    height: auto;
+  }
+
+  .thumbnail {
+    height: 80px;
+  }
+
+  .action-buttons .btn {
+    width: 100%;
+  }
+
+  .date-inputs {
+    grid-template-columns: 1fr;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/main_dc/yalarba/easySite/easySite/app/pages/objects/create.vue b/main_dc/yalarba/easySite/easySite/app/pages/objects/create.vue
index 3669c8f..8cba4d8 100644
--- a/main_dc/yalarba/easySite/easySite/app/pages/objects/create.vue
+++ b/main_dc/yalarba/easySite/easySite/app/pages/objects/create.vue
@@ -1,14 +1,28 @@
-<!-- pages/objects/create.vue -->
 <template>
-  <div class="min-h-screen bg-gray-50 py-8">
-    <div class="container max-w-4xl">
-      <div class="mb-8">
-        <h1 class="text-3xl font-bold">Добавить новый объект</h1>
-        <p class="text-gray-600 mt-2">Заполните информацию о вашем объекте</p>
-      </div>
+  <div class="page-wrapper">
+    <Header />
 
-      <ObjectForm :loading="loading" @submit="handleSubmit" @cancel="handleCancel" />
-    </div>
+    <main class="create-object-page">
+      <div class="container max-w-4xl">
+        <!-- Заголовок -->
+        <div class="page-header">
+          <div class="header-content">
+            <div class="header-text">
+              <h1 class="page-title">Добавить новый объект</h1>
+              <p class="page-subtitle">Заполните информацию о вашем объекте</p>
+            </div>
+            <NuxtLink to="/objects/my-objects" class="btn btn-outline btn-with-icon">
+              ← Мои объекты
+            </NuxtLink>
+          </div>
+        </div>
+
+        <!-- Форма -->
+        <ObjectForm :loading="loading" @submit="handleSubmit" @cancel="handleCancel" />
+      </div>
+    </main>
+
+    <Footer />
   </div>
 </template>
 
@@ -45,4 +59,68 @@ const handleSubmit = async (formData: any) => {
 const handleCancel = () => {
   navigateTo('/objects/my-objects')
 }
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+.create-object-page {
+  padding: var(--space-xl) 0;
+  min-height: calc(100vh - 160px);
+  background: var(--bg-secondary);
+}
+
+.page-header {
+  background: var(--bg-primary);
+  border-radius: var(--radius-lg);
+  padding: var(--space-xl);
+  margin-bottom: var(--space-lg);
+  box-shadow: var(--shadow-sm);
+  border: 1px solid var(--border-light);
+}
+
+.header-content {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  gap: var(--space-lg);
+}
+
+.header-text {
+  flex: 1;
+}
+
+.page-title {
+  font-family: var(--font-heading);
+  font-size: var(--text-3xl);
+  font-weight: var(--font-bold);
+  color: var(--text-primary);
+  margin-bottom: var(--space-xs);
+}
+
+.page-subtitle {
+  font-size: var(--text-lg);
+  color: var(--text-secondary);
+}
+
+/* Адаптивность */
+@media (max-width: 768px) {
+  .header-content {
+    flex-direction: column;
+    align-items: stretch;
+    gap: var(--space-md);
+  }
+
+  .header-content .btn {
+    align-self: flex-start;
+  }
+}
+
+@media (max-width: 480px) {
+  .page-header {
+    padding: var(--space-lg);
+  }
+
+  .page-title {
+    font-size: var(--text-2xl);
+  }
+}
+</style>
\ No newline at end of file
diff --git a/main_dc/yalarba/easySite/easySite/app/pages/objects/index.vue b/main_dc/yalarba/easySite/easySite/app/pages/objects/index.vue
index a10c01f..b41834d 100644
--- a/main_dc/yalarba/easySite/easySite/app/pages/objects/index.vue
+++ b/main_dc/yalarba/easySite/easySite/app/pages/objects/index.vue
@@ -1,103 +1,144 @@
-<!-- pages/objects/index.vue -->
 <template>
-  <div class="min-h-screen bg-gray-50 py-8">
-    <div class="container">
-      <!-- Заголовок и кнопка добавления -->
-      <div class="flex justify-between items-center mb-8">
-        <div>
-          <h1 class="text-3xl font-bold">Все объекты</h1>
-          <p class="text-gray-600 mt-2">База объектов для путешествий</p>
-        </div>
-        <NuxtLink to="/objects/create" class="btn btn-primary">
-          Добавить объект
-        </NuxtLink>
-      </div>
+  <div class="page-wrapper">
+    <Header />
 
-      <!-- Фильтры поиска -->
-      <div class="search-filters mb-8">
-        <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-4">
-          <div class="form-group">
-            <label class="form-label">Тип объекта</label>
-            <select v-model="filters.type" class="form-select">
-              <option value="">Все типы</option>
-              <option value="hotel">Гостиница</option>
-              <option value="sanatorium">Санаторий</option>
-              <option value="tour">Тур</option>
-              <option value="restaurant">Ресторан</option>
+    <main class="objects-page">
+      <div class="container">
+        <!-- Заголовок и действия -->
+        <div class="page-header">
+          <div class="header-content">
+            <div class="header-text">
+              <h1 class="page-title">Все объекты</h1>
+              <p class="page-subtitle">Найдено {{ filteredObjects.length }} объектов</p>
+            </div>
+            <div class="header-actions">
+              <button @click="showFilters = !showFilters" class="btn btn-outline btn-with-icon">
+                <span>🔍</span>
+                Фильтры
+                <span v-if="activeFiltersCount > 0" class="badge badge-primary">
+                  {{ activeFiltersCount }}
+                </span>
+              </button>
+              <NuxtLink to="/objects/create" class="btn btn-primary btn-with-icon">
+                <span>➕</span>
+                Добавить объект
+              </NuxtLink>
+            </div>
+          </div>
+
+          <!-- Быстрые фильтры -->
+          <div class="quick-filters">
+            <button v-for="type in quickTypes" :key="type.value" @click="toggleQuickFilter(type.value)"
+              class="quick-filter" :class="{ active: filters.type === type.value }">
+              {{ type.icon }} {{ type.label }}
+            </button>
+          </div>
+        </div>
+
+        <!-- Расширенные фильтры -->
+        <div v-if="showFilters" class="search-filters card">
+          <div class="filter-grid">
+            <div class="form-group">
+              <label class="form-label">Тип объекта</label>
+              <select v-model="filters.type" class="form-select">
+                <option value="">Все типы</option>
+                <option value="hotel">🏨 Гостиница</option>
+                <option value="sanatorium">🏥 Санаторий</option>
+                <option value="tour">🧳 Тур</option>
+                <option value="restaurant">🍴 Ресторан</option>
+                <option value="guest_house">🏡 Гостевой дом</option>
+              </select>
+            </div>
+
+            <div class="form-group">
+              <label class="form-label">Город</label>
+              <input v-model="filters.city" type="text" class="form-input" placeholder="Введите город">
+            </div>
+
+            <div class="form-group">
+              <label class="form-label">Цена до</label>
+              <input v-model="filters.maxPrice" type="number" class="form-input" placeholder="Макс. цена">
+            </div>
+
+            <div class="form-group">
+              <label class="form-label">Рейтинг от</label>
+              <select v-model="filters.minRating" class="form-select">
+                <option value="0">Любой рейтинг</option>
+                <option value="4">⭐ 4.0+</option>
+                <option value="4.5">⭐ 4.5+</option>
+                <option value="4.8">⭐ 4.8+</option>
+              </select>
+            </div>
+          </div>
+
+          <div class="filter-actions">
+            <button class="btn btn-primary" @click="applyFilters">
+              Применить фильтры
+            </button>
+            <button class="btn btn-outline" @click="resetFilters">
+              Сбросить
+            </button>
+          </div>
+        </div>
+
+        <!-- Управление видом -->
+        <div class="view-controls">
+          <div class="sort-controls">
+            <select v-model="sortBy" class="form-select">
+              <option value="title">По названию</option>
+              <option value="price">По цене</option>
+              <option value="rating">По рейтингу</option>
+              <option value="city">По городу</option>
             </select>
+            <button @click="sortOrder = sortOrder === 'asc' ? 'desc' : 'asc'" class="btn btn-outline btn-sm">
+              {{ sortOrder === 'asc' ? '↑' : '↓' }}
+            </button>
           </div>
-          <div class="form-group">
-            <label class="form-label">Город</label>
-            <input 
-              v-model="filters.city" 
-              type="text" 
-              class="form-input" 
-              placeholder="Введите город"
-            >
-          </div>
-          <div class="form-group">
-            <label class="form-label">Цена до</label>
-            <input 
-              v-model="filters.maxPrice" 
-              type="number" 
-              class="form-input" 
-              placeholder="Макс. цена"
-            >
+
+          <div class="view-toggle">
+            <button @click="viewMode = 'grid'" class="btn btn-outline btn-sm"
+              :class="{ 'btn-primary': viewMode === 'grid' }">
+              ▦
+            </button>
+            <button @click="viewMode = 'list'" class="btn btn-outline btn-sm"
+              :class="{ 'btn-primary': viewMode === 'list' }">
+              ☰
+            </button>
           </div>
         </div>
-        <div class="flex gap-4">
-          <div class="form-group flex-1">
-            <input 
-              v-model="filters.search" 
-              type="text" 
-              class="form-input"
-              placeholder="Поиск по названию, городу или описанию..."
-              @keyup.enter="searchObjects"
-            >
-          </div>
-          <button class="btn btn-primary" @click="searchObjects">
-            Найти
+
+        <!-- Результаты -->
+        <div v-if="loading" class="loading-state">
+          <div class="loading-spinner"></div>
+          <p class="loading-text">Загрузка объектов...</p>
+        </div>
+
+        <div v-else-if="filteredObjects.length === 0" class="empty-state">
+          <div class="empty-icon">🏢</div>
+          <h3 class="empty-title">Объекты не найдены</h3>
+          <p class="empty-description">Попробуйте изменить параметры поиска</p>
+          <button @click="resetFilters" class="btn btn-primary">
+            Сбросить фильтры
           </button>
-          <button class="btn btn-outline" @click="resetSearch">
-            Сброс
+        </div>
+
+        <!-- Сетка объектов -->
+        <div v-else class="objects-grid" :class="viewMode === 'grid' ? 'grid-view' : 'list-view'">
+          <ObjectCard v-for="object in paginatedObjects" :key="object.id" :object="object" :view-mode="viewMode"
+            @click="navigateToObject(object.id)" />
+        </div>
+
+        <!-- Пагинация -->
+        <div v-if="!loading && filteredObjects.length > 0" class="pagination">
+          <button v-for="page in totalPages" :key="page" @click="currentPage = page" class="pagination-btn"
+            :class="{ active: currentPage === page }">
+            {{ page }}
           </button>
         </div>
       </div>
+    </main>
 
-      <!-- Быстрые ссылки -->
-      <div class="flex gap-4 mb-6">
-        <NuxtLink to="/objects/my-objects" class="btn btn-outline">
-          📝 Мои объекты
-        </NuxtLink>
-        <NuxtLink to="/objects/create" class="btn btn-outline">
-          ➕ Добавить объект
-        </NuxtLink>
-      </div>
-
-      <!-- Результаты поиска -->
-      <div v-if="loading" class="text-center py-12">
-        <div class="animate-spin rounded-full h-12 w-12 border-b-2 border-primary-500 mx-auto"></div>
-        <p class="mt-4 text-gray-600">Загрузка объектов...</p>
-      </div>
-
-      <div v-else-if="objects.length === 0" class="text-center py-12">
-        <div class="text-gray-400 text-6xl mb-4">🏢</div>
-        <h3 class="text-xl font-semibold mb-2">Объекты не найдены</h3>
-        <p class="text-gray-600 mb-6">Попробуйте изменить поисковый запрос или добавьте первый объект</p>
-        <NuxtLink to="/objects/create" class="btn btn-primary">
-          Добавить первый объект
-        </NuxtLink>
-      </div>
-
-      <div v-else class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
-        <ObjectCard 
-          v-for="object in objects"
-          :key="object.id"
-          :object="object"
-          @click="navigateToObject(object.id)"
-        />
-      </div>
-    </div>
+    <Footer />
   </div>
 </template>
 
@@ -112,8 +153,40 @@ interface ObjectItem {
   image: string
   description: string
   isActive: boolean
+  createdAt: string
 }
 
+// Навигация
+useHead({
+  title: 'Все объекты - EasySite'
+})
+
+// Состояние
+const objects = ref<ObjectItem[]>([])
+const loading = ref(true)
+const showFilters = ref(false)
+const viewMode = ref<'grid' | 'list'>('grid')
+const sortBy = ref<'title' | 'price' | 'rating' | 'city'>('title')
+const sortOrder = ref<'asc' | 'desc'>('asc')
+const currentPage = ref(1)
+const itemsPerPage = 9
+
+const filters = ref({
+  search: '',
+  type: '',
+  city: '',
+  maxPrice: null as number | null,
+  minRating: 0
+})
+
+// Быстрые фильтры
+const quickTypes = [
+  { value: 'hotel', label: 'Гостиницы', icon: '🏨' },
+  { value: 'sanatorium', label: 'Санатории', icon: '🏥' },
+  { value: 'tour', label: 'Туры', icon: '🧳' },
+  { value: 'restaurant', label: 'Рестораны', icon: '🍴' }
+]
+
 // Мок-данные
 const mockObjects: ObjectItem[] = [
   {
@@ -124,88 +197,407 @@ const mockObjects: ObjectItem[] = [
     price: 4500,
     rating: 4.8,
     image: '/images/hotels/edelweiss.jpg',
-    description: 'Комфортабельный отель в горах с видом на море',
-    isActive: true
+    description: 'Комфортабельный отель в горах с видом на море. Идеальное место для отдыха от городской суеты.',
+    isActive: true,
+    createdAt: '2024-01-15'
   },
   {
     id: 2,
-    title: 'Тур по Алтаю',
-    type: 'tour',
-    city: 'Горно-Алтайск',
-    price: 12500,
-    rating: 4.9,
-    image: '/images/tours/altai.jpg',
-    description: '7-дневный тур по самым живописным местам Алтая',
-    isActive: true
-  },
-  {
-    id: 3,
     title: 'Санаторий "Здоровье"',
     type: 'sanatorium',
     city: 'Кисловодск',
     price: 3200,
     rating: 4.6,
     image: '/images/sanatoriums/health.jpg',
-    description: 'Лечебно-оздоровительный комплекс с минеральными водами',
-    isActive: true
+    description: 'Лечебно-оздоровительный комплекс с минеральными водами и современным оборудованием.',
+    isActive: true,
+    createdAt: '2024-01-10'
+  },
+  {
+    id: 3,
+    title: 'Тур по Золотому кольцу',
+    type: 'tour',
+    city: 'Москва',
+    price: 12500,
+    rating: 4.9,
+    image: '/images/tours/golden-ring.jpg',
+    description: '7-дневный тур по древним городам России с опытным гидом и комфортабельным транспортом.',
+    isActive: true,
+    createdAt: '2024-01-08'
   }
 ]
 
-const objects = ref<ObjectItem[]>(mockObjects)
-const loading = ref(false)
-
-const filters = ref({
-  search: '',
-  type: '',
-  city: '',
-  maxPrice: null as number | null
+// Вычисляемые свойства
+const activeFiltersCount = computed(() => {
+  return Object.values(filters.value).filter(val =>
+    val !== '' && val !== null && val !== 0
+  ).length
 })
 
-const searchObjects = async () => {
-  loading.value = true
-  // Имитация загрузки
-  await new Promise(resolve => setTimeout(resolve, 500))
-  
-  let filtered = [...mockObjects]
-  
+const filteredObjects = computed(() => {
+  let filtered = [...objects.value]
+
   if (filters.value.search) {
     const search = filters.value.search.toLowerCase()
-    filtered = filtered.filter(obj => 
+    filtered = filtered.filter(obj =>
       obj.title.toLowerCase().includes(search) ||
       obj.city.toLowerCase().includes(search) ||
       obj.description.toLowerCase().includes(search)
     )
   }
-  
+
   if (filters.value.type) {
     filtered = filtered.filter(obj => obj.type === filters.value.type)
   }
-  
+
   if (filters.value.city) {
-    filtered = filtered.filter(obj => 
+    filtered = filtered.filter(obj =>
       obj.city.toLowerCase().includes(filters.value.city.toLowerCase())
     )
   }
-  
+
   if (filters.value.maxPrice) {
     filtered = filtered.filter(obj => obj.price <= filters.value.maxPrice!)
   }
-  
-  objects.value = filtered
-  loading.value = false
+
+  if (filters.value.minRating) {
+    filtered = filtered.filter(obj => obj.rating >= filters.value.minRating!)
+  }
+
+  return filtered
+})
+
+const sortedObjects = computed(() => {
+  const sorted = [...filteredObjects.value].sort((a, b) => {
+    let aVal = a[sortBy.value]
+    let bVal = b[sortBy.value]
+
+    if (sortBy.value === 'price' || sortBy.value === 'rating') {
+      return sortOrder.value === 'asc' ? aVal - bVal : bVal - aVal
+    }
+
+    aVal = String(aVal).toLowerCase()
+    bVal = String(bVal).toLowerCase()
+
+    if (sortOrder.value === 'asc') {
+      return aVal.localeCompare(bVal)
+    } else {
+      return bVal.localeCompare(aVal)
+    }
+  })
+
+  return sorted
+})
+
+const paginatedObjects = computed(() => {
+  const start = (currentPage.value - 1) * itemsPerPage
+  return sortedObjects.value.slice(start, start + itemsPerPage)
+})
+
+const totalPages = computed(() => {
+  return Math.ceil(filteredObjects.value.length / itemsPerPage)
+})
+
+// Методы
+const toggleQuickFilter = (type: string) => {
+  filters.value.type = filters.value.type === type ? '' : type
+  applyFilters()
 }
 
-const resetSearch = async () => {
+const applyFilters = () => {
+  currentPage.value = 1
+}
+
+const resetFilters = () => {
   filters.value = {
     search: '',
     type: '',
     city: '',
-    maxPrice: null
+    maxPrice: null,
+    minRating: 0
   }
-  objects.value = mockObjects
+  currentPage.value = 1
 }
 
 const navigateToObject = (id: number) => {
   navigateTo(`/objects/${id}`)
 }
-</script>
\ No newline at end of file
+
+// Инициализация
+onMounted(async () => {
+  loading.value = true
+  await new Promise(resolve => setTimeout(resolve, 800))
+  objects.value = mockObjects
+  loading.value = false
+})
+
+// Следим за изменениями фильтров
+watch([filters, sortBy, sortOrder], () => {
+  applyFilters()
+})
+</script>
+
+<style scoped>
+.objects-page {
+  padding: var(--space-xl) 0;
+  min-height: calc(100vh - 160px);
+  background: var(--bg-secondary);
+}
+
+.page-header {
+  background: var(--bg-primary);
+  border-radius: var(--radius-lg);
+  padding: var(--space-xl);
+  margin-bottom: var(--space-lg);
+  box-shadow: var(--shadow-sm);
+  border: 1px solid var(--border-light);
+}
+
+.header-content {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  gap: var(--space-lg);
+  margin-bottom: var(--space-lg);
+}
+
+.header-text {
+  flex: 1;
+}
+
+.page-title {
+  font-family: var(--font-heading);
+  font-size: var(--text-3xl);
+  font-weight: var(--font-bold);
+  color: var(--text-primary);
+  margin-bottom: var(--space-xs);
+}
+
+.page-subtitle {
+  font-size: var(--text-lg);
+  color: var(--text-secondary);
+}
+
+.header-actions {
+  display: flex;
+  gap: var(--space-sm);
+  flex-wrap: wrap;
+}
+
+.quick-filters {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--space-sm);
+}
+
+.quick-filter {
+  padding: var(--space-sm) var(--space-md);
+  border: 1px solid var(--border-light);
+  border-radius: var(--radius-lg);
+  background: var(--bg-primary);
+  cursor: pointer;
+  transition: all 0.3s ease;
+  font-size: var(--text-sm);
+  font-weight: var(--font-medium);
+}
+
+.quick-filter:hover {
+  border-color: var(--primary-300);
+  background: var(--primary-50);
+  transform: translateY(-1px);
+}
+
+.quick-filter.active {
+  background: var(--primary-500);
+  color: var(--text-inverse);
+  border-color: var(--primary-500);
+}
+
+.filter-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+  gap: var(--space-lg);
+  margin-bottom: var(--space-lg);
+}
+
+.filter-actions {
+  display: flex;
+  gap: var(--space-sm);
+  flex-wrap: wrap;
+}
+
+.view-controls {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: var(--space-lg);
+  padding: var(--space-md);
+  background: var(--bg-primary);
+  border-radius: var(--radius-lg);
+  border: 1px solid var(--border-light);
+}
+
+.sort-controls {
+  display: flex;
+  align-items: center;
+  gap: var(--space-sm);
+}
+
+.view-toggle {
+  display: flex;
+  gap: var(--space-xs);
+}
+
+.objects-grid.grid-view {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
+  gap: var(--space-lg);
+}
+
+.objects-grid.list-view {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-md);
+}
+
+.loading-state {
+  text-align: center;
+  padding: var(--space-2xl);
+}
+
+.loading-spinner {
+  width: 3rem;
+  height: 3rem;
+  border: 3px solid var(--border-light);
+  border-top: 3px solid var(--primary-500);
+  border-radius: 50%;
+  animation: spin 1s linear infinite;
+  margin: 0 auto var(--space-md);
+}
+
+.loading-text {
+  color: var(--text-secondary);
+  font-size: var(--text-lg);
+}
+
+.empty-state {
+  text-align: center;
+  padding: var(--space-2xl);
+  background: var(--bg-primary);
+  border-radius: var(--radius-lg);
+  border: 1px solid var(--border-light);
+}
+
+.empty-icon {
+  font-size: 4rem;
+  margin-bottom: var(--space-lg);
+  opacity: 0.5;
+}
+
+.empty-title {
+  font-family: var(--font-heading);
+  font-size: var(--text-xl);
+  font-weight: var(--font-semibold);
+  color: var(--text-primary);
+  margin-bottom: var(--space-sm);
+}
+
+.empty-description {
+  color: var(--text-secondary);
+  margin-bottom: var(--space-lg);
+}
+
+.pagination {
+  display: flex;
+  justify-content: center;
+  gap: var(--space-xs);
+  margin-top: var(--space-xl);
+}
+
+.pagination-btn {
+  padding: var(--space-sm) var(--space-md);
+  border: 1px solid var(--border-light);
+  border-radius: var(--radius-md);
+  background: var(--bg-primary);
+  color: var(--text-primary);
+  cursor: pointer;
+  transition: all 0.3s ease;
+  font-weight: var(--font-medium);
+}
+
+.pagination-btn:hover {
+  border-color: var(--primary-300);
+  background: var(--primary-50);
+}
+
+.pagination-btn.active {
+  background: var(--primary-500);
+  color: var(--text-inverse);
+  border-color: var(--primary-500);
+}
+
+@keyframes spin {
+  0% {
+    transform: rotate(0deg);
+  }
+
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+/* Адаптивность */
+@media (max-width: 768px) {
+  .header-content {
+    flex-direction: column;
+    align-items: stretch;
+  }
+
+  .header-actions {
+    justify-content: stretch;
+  }
+
+  .header-actions .btn {
+    flex: 1;
+    min-width: auto;
+  }
+
+  .filter-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .view-controls {
+    flex-direction: column;
+    gap: var(--space-md);
+    align-items: stretch;
+  }
+
+  .sort-controls {
+    justify-content: space-between;
+  }
+
+  .objects-grid.grid-view {
+    grid-template-columns: 1fr;
+  }
+}
+
+@media (max-width: 480px) {
+  .page-header {
+    padding: var(--space-lg);
+  }
+
+  .page-title {
+    font-size: var(--text-2xl);
+  }
+
+  .quick-filters {
+    justify-content: center;
+  }
+
+  .quick-filter {
+    flex: 1;
+    min-width: 120px;
+    text-align: center;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/main_dc/yalarba/easySite/easySite/app/pages/objects/my-objects.vue b/main_dc/yalarba/easySite/easySite/app/pages/objects/my-objects.vue
index b24073c..23fcadd 100644
--- a/main_dc/yalarba/easySite/easySite/app/pages/objects/my-objects.vue
+++ b/main_dc/yalarba/easySite/easySite/app/pages/objects/my-objects.vue
@@ -1,29 +1,32 @@
-<!-- pages/objects/my-objects.vue -->
 <template>
-  <div class="min-h-screen bg-gray-50 py-8">
-    <div class="container">
-      <!-- Заголовок -->
-      <div class="mb-8">
-        <div class="flex justify-between items-center mb-6">
-          <div>
-            <h1 class="text-3xl font-bold">Мои объекты</h1>
-            <p class="text-gray-600 mt-2">Управление вашими добавленными местами</p>
-          </div>
-          <div class="flex gap-3">
-            <NuxtLink to="/objects" class="btn btn-outline">
-              🔍 Все объекты
-            </NuxtLink>
-            <NuxtLink to="/objects/create" class="btn btn-primary">
-              Добавить объект
-            </NuxtLink>
+  <div class="page-wrapper">
+    <Header />
+
+    <main class="my-objects-page">
+      <div class="container">
+        <!-- Заголовок -->
+        <div class="page-header">
+          <div class="header-content">
+            <div class="header-text">
+              <h1 class="page-title">Мои объекты</h1>
+              <p class="page-subtitle">Управление вашими добавленными местами</p>
+            </div>
+            <div class="header-actions">
+              <NuxtLink to="/objects" class="btn btn-outline btn-with-icon">
+                <span>🔍</span>
+                Все объекты
+              </NuxtLink>
+              <NuxtLink to="/objects/create" class="btn btn-primary btn-with-icon">
+                <span>➕</span>
+                Добавить объект
+              </NuxtLink>
+            </div>
           </div>
         </div>
-      </div>
 
-      <!-- Фильтры -->
-      <div class="card mb-6">
-        <div class="card-body">
-          <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
+        <!-- Фильтры -->
+        <div class="search-filters card">
+          <div class="filter-grid">
             <div class="form-group">
               <label class="form-label">Статус</label>
               <select v-model="filters.status" class="form-select">
@@ -36,22 +39,18 @@
               <label class="form-label">Тип</label>
               <select v-model="filters.type" class="form-select">
                 <option value="">Все типы</option>
-                <option value="hotel">Гостиница</option>
-                <option value="sanatorium">Санаторий</option>
-                <option value="tour">Тур</option>
+                <option value="hotel">🏨 Гостиница</option>
+                <option value="sanatorium">🏥 Санаторий</option>
+                <option value="tour">🧳 Тур</option>
+                <option value="guest_house">🏡 Гостевой дом</option>
               </select>
             </div>
             <div class="form-group">
               <label class="form-label">Поиск</label>
-              <input 
-                v-model="filters.search" 
-                type="text" 
-                class="form-input" 
-                placeholder="Название или город"
-              >
+              <input v-model="filters.search" type="text" class="form-input" placeholder="Название или город">
             </div>
           </div>
-          <div class="flex gap-2 mt-4">
+          <div class="filter-actions">
             <button class="btn btn-primary" @click="applyFilters">
               Применить
             </button>
@@ -60,104 +59,93 @@
             </button>
           </div>
         </div>
-      </div>
 
-      <!-- Таблица объектов -->
-      <div class="card">
-        <div class="card-header">
-          <h2 class="text-xl font-semibold">Список объектов</h2>
-        </div>
-        
-        <div class="overflow-x-auto">
-          <table class="w-full">
-            <thead>
-              <tr class="border-b border-gray-200">
-                <th class="text-left py-3 px-4">Название</th>
-                <th class="text-left py-3 px-4">Тип</th>
-                <th class="text-left py-3 px-4">Город</th>
-                <th class="text-left py-3 px-4">Цена</th>
-                <th class="text-left py-3 px-4">Статус</th>
-                <th class="text-left py-3 px-4">Действия</th>
-              </tr>
-            </thead>
-            <tbody>
-              <tr 
-                v-for="object in myObjects"
-                :key="object.id"
-                class="border-b border-gray-100 hover:bg-gray-50"
-              >
-                <td class="py-3 px-4">
-                  <div class="font-medium">{{ object.title }}</div>
-                  <div class="text-sm text-gray-500">{{ formatDate(object.createdAt) }}</div>
-                </td>
-                <td class="py-3 px-4">
-                  <span class="badge badge-primary">
-                    {{ getTypeLabel(object.type) }}
-                  </span>
-                </td>
-                <td class="py-3 px-4">{{ object.city }}</td>
-                <td class="py-3 px-4 font-medium">
-                  {{ formatPrice(object.price) }}
-                </td>
-                <td class="py-3 px-4">
-                  <span 
-                    class="badge"
-                    :class="object.isActive ? 'badge-success' : 'badge-secondary'"
-                  >
-                    {{ object.isActive ? 'Активен' : 'Неактивен' }}
-                  </span>
-                </td>
-                <td class="py-3 px-4">
-                  <div class="flex gap-2">
-                    <NuxtLink 
-                      :to="`/objects/${object.id}`"
-                      class="btn btn-outline btn-sm"
-                    >
-                      Просмотр
-                    </NuxtLink>
-                    <NuxtLink 
-                      :to="`/objects/${object.id}/edit`"
-                      class="btn btn-outline btn-sm"
-                    >
-                      Редактировать
-                    </NuxtLink>
-                    <button 
-                      @click="deleteObject(object.id)"
-                      class="btn btn-outline btn-sm text-red-600 hover:bg-red-50"
-                    >
-                      Удалить
-                    </button>
-                  </div>
-                </td>
-              </tr>
-            </tbody>
-          </table>
+        <!-- Таблица объектов -->
+        <div class="objects-table card">
+          <div class="card-header">
+            <h2 class="card-title">Список объектов</h2>
+            <p class="card-subtitle">Всего: {{ myObjects.length }} объектов</p>
+          </div>
+
+          <div class="table-container">
+            <table class="objects-table">
+              <thead>
+                <tr>
+                  <th class="table-header">Название</th>
+                  <th class="table-header">Тип</th>
+                  <th class="table-header">Город</th>
+                  <th class="table-header">Цена</th>
+                  <th class="table-header">Статус</th>
+                  <th class="table-header">Действия</th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr v-for="object in myObjects" :key="object.id" class="table-row">
+                  <td class="table-cell">
+                    <div class="object-info">
+                      <div class="object-title">{{ object.title }}</div>
+                      <div class="object-date">{{ formatDate(object.createdAt) }}</div>
+                    </div>
+                  </td>
+                  <td class="table-cell">
+                    <span class="badge badge-primary">
+                      {{ getTypeLabel(object.type) }}
+                    </span>
+                  </td>
+                  <td class="table-cell">{{ object.city }}</td>
+                  <td class="table-cell">
+                    <div class="object-price">{{ formatPrice(object.price) }}</div>
+                  </td>
+                  <td class="table-cell">
+                    <span class="status-badge" :class="object.isActive ? 'status-active' : 'status-inactive'">
+                      {{ object.isActive ? 'Активен' : 'Неактивен' }}
+                    </span>
+                  </td>
+                  <td class="table-cell">
+                    <div class="action-buttons">
+                      <NuxtLink :to="`/objects/${object.id}`" class="btn btn-outline btn-sm btn-with-icon"
+                        title="Просмотр">
+                        👁️
+                      </NuxtLink>
+                      <NuxtLink :to="`/objects/${object.id}/edit`" class="btn btn-outline btn-sm btn-with-icon"
+                        title="Редактировать">
+                        ✏️
+                      </NuxtLink>
+                      <button @click="deleteObject(object.id)" class="btn btn-outline btn-sm btn-with-icon delete-btn"
+                        title="Удалить">
+                        🗑️
+                      </button>
+                    </div>
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+
+          <!-- Пустой state -->
+          <div v-if="!loading && myObjects.length === 0" class="empty-state">
+            <div class="empty-icon">🏢</div>
+            <h3 class="empty-title">У вас пока нет объектов</h3>
+            <p class="empty-description">Добавьте первый объект, чтобы начать работу</p>
+            <NuxtLink to="/objects/create" class="btn btn-primary">
+              Добавить первый объект
+            </NuxtLink>
+          </div>
         </div>
 
-        <!-- Пустой state -->
-        <div 
-          v-if="!loading && myObjects.length === 0"
-          class="text-center py-12"
-        >
-          <div class="text-gray-400 text-6xl mb-4">🏢</div>
-          <h3 class="text-xl font-semibold mb-2">У вас пока нет объектов</h3>
-          <p class="text-gray-600 mb-6">Добавьте первый объект, чтобы начать работу</p>
-          <NuxtLink to="/objects/create" class="btn btn-primary">
-            Добавить первый объект
+        <!-- Навигация -->
+        <div class="page-navigation">
+          <NuxtLink to="/objects" class="btn btn-outline btn-with-icon">
+            ← Все объекты
+          </NuxtLink>
+          <NuxtLink to="/" class="btn btn-outline btn-with-icon">
+            🏠 На главную
           </NuxtLink>
         </div>
       </div>
+    </main>
 
-      <!-- Навигация -->
-      <div class="mt-8 flex justify-between">
-        <NuxtLink to="/objects" class="btn btn-outline">
-          ← Все объекты
-        </NuxtLink>
-        <NuxtLink to="/" class="btn btn-outline">
-          🏠 На главную
-        </NuxtLink>
-      </div>
-    </div>
+    <Footer />
   </div>
 </template>
 
@@ -186,7 +174,7 @@ const mockMyObjects: MyObjectItem[] = [
   {
     id: 2,
     title: 'Экскурсия по историческому центру',
-    type: 'excursion',
+    type: 'tour',
     city: 'Санкт-Петербург',
     price: 1500,
     isActive: true,
@@ -214,25 +202,25 @@ const filters = ref({
 
 const applyFilters = () => {
   let filtered = [...mockMyObjects]
-  
+
   if (filters.value.status) {
-    filtered = filtered.filter(obj => 
+    filtered = filtered.filter(obj =>
       filters.value.status === 'active' ? obj.isActive : !obj.isActive
     )
   }
-  
+
   if (filters.value.type) {
     filtered = filtered.filter(obj => obj.type === filters.value.type)
   }
-  
+
   if (filters.value.search) {
     const search = filters.value.search.toLowerCase()
-    filtered = filtered.filter(obj => 
+    filtered = filtered.filter(obj =>
       obj.title.toLowerCase().includes(search) ||
       obj.city.toLowerCase().includes(search)
     )
   }
-  
+
   myObjects.value = filtered
 }
 
@@ -247,7 +235,6 @@ const resetFilters = () => {
 
 const deleteObject = async (id: number) => {
   if (confirm('Вы уверены, что хотите удалить этот объект?')) {
-    // Имитация удаления
     myObjects.value = myObjects.value.filter(obj => obj.id !== id)
   }
 }
@@ -274,4 +261,266 @@ const formatPrice = (price: number) => {
 const formatDate = (dateString: string) => {
   return new Date(dateString).toLocaleDateString('ru-RU')
 }
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+.my-objects-page {
+  padding: var(--space-xl) 0;
+  min-height: calc(100vh - 160px);
+  background: var(--bg-secondary);
+}
+
+.page-header {
+  background: var(--bg-primary);
+  border-radius: var(--radius-lg);
+  padding: var(--space-xl);
+  margin-bottom: var(--space-lg);
+  box-shadow: var(--shadow-sm);
+  border: 1px solid var(--border-light);
+}
+
+.header-content {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  gap: var(--space-lg);
+}
+
+.header-text {
+  flex: 1;
+}
+
+.page-title {
+  font-family: var(--font-heading);
+  font-size: var(--text-3xl);
+  font-weight: var(--font-bold);
+  color: var(--text-primary);
+  margin-bottom: var(--space-xs);
+}
+
+.page-subtitle {
+  font-size: var(--text-lg);
+  color: var(--text-secondary);
+}
+
+.header-actions {
+  display: flex;
+  gap: var(--space-sm);
+  flex-wrap: wrap;
+}
+
+.filter-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+  gap: var(--space-lg);
+  margin-bottom: var(--space-lg);
+}
+
+.filter-actions {
+  display: flex;
+  gap: var(--space-sm);
+  flex-wrap: wrap;
+}
+
+.objects-table {
+  width: 100%;
+}
+
+.card-header {
+  padding: var(--space-xl);
+  border-bottom: 1px solid var(--border-light);
+  background: var(--bg-primary);
+}
+
+.card-title {
+  font-family: var(--font-heading);
+  font-size: var(--text-xl);
+  font-weight: var(--font-semibold);
+  color: var(--text-primary);
+  margin-bottom: var(--space-xs);
+}
+
+.card-subtitle {
+  color: var(--text-secondary);
+  font-size: var(--text-sm);
+}
+
+.table-container {
+  overflow-x: auto;
+}
+
+.objects-table {
+  width: 100%;
+  border-collapse: collapse;
+}
+
+.table-header {
+  padding: var(--space-md);
+  text-align: left;
+  font-weight: var(--font-semibold);
+  color: var(--text-secondary);
+  border-bottom: 1px solid var(--border-light);
+  background: var(--bg-secondary);
+  font-size: var(--text-sm);
+  text-transform: uppercase;
+  letter-spacing: var(--tracking-wide);
+}
+
+.table-row {
+  border-bottom: 1px solid var(--border-light);
+  transition: background-color 0.3s ease;
+}
+
+.table-row:hover {
+  background: var(--bg-secondary);
+}
+
+.table-cell {
+  padding: var(--space-md);
+  vertical-align: middle;
+}
+
+.object-info {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-xs);
+}
+
+.object-title {
+  font-weight: var(--font-semibold);
+  color: var(--text-primary);
+}
+
+.object-date {
+  font-size: var(--text-sm);
+  color: var(--text-tertiary);
+}
+
+.object-price {
+  font-weight: var(--font-semibold);
+  color: var(--primary-600);
+  font-size: var(--text-lg);
+}
+
+.status-badge {
+  padding: var(--space-xs) var(--space-sm);
+  border-radius: var(--radius-sm);
+  font-size: var(--text-xs);
+  font-weight: var(--font-medium);
+  text-transform: uppercase;
+  letter-spacing: var(--tracking-wide);
+}
+
+.status-active {
+  background: var(--success-50);
+  color: var(--success-600);
+}
+
+.status-inactive {
+  background: var(--gray-100);
+  color: var(--gray-600);
+}
+
+.action-buttons {
+  display: flex;
+  gap: var(--space-xs);
+}
+
+.delete-btn:hover {
+  background: var(--error-50);
+  border-color: var(--error-300);
+  color: var(--error-600);
+}
+
+.empty-state {
+  text-align: center;
+  padding: var(--space-2xl);
+}
+
+.empty-icon {
+  font-size: 4rem;
+  margin-bottom: var(--space-lg);
+  opacity: 0.5;
+}
+
+.empty-title {
+  font-family: var(--font-heading);
+  font-size: var(--text-xl);
+  font-weight: var(--font-semibold);
+  color: var(--text-primary);
+  margin-bottom: var(--space-sm);
+}
+
+.empty-description {
+  color: var(--text-secondary);
+  margin-bottom: var(--space-lg);
+}
+
+.page-navigation {
+  display: flex;
+  justify-content: space-between;
+  margin-top: var(--space-xl);
+  padding-top: var(--space-lg);
+  border-top: 1px solid var(--border-light);
+}
+
+/* Адаптивность */
+@media (max-width: 768px) {
+  .header-content {
+    flex-direction: column;
+    align-items: stretch;
+  }
+
+  .header-actions {
+    justify-content: stretch;
+  }
+
+  .header-actions .btn {
+    flex: 1;
+    min-width: auto;
+  }
+
+  .filter-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .table-container {
+    font-size: var(--text-sm);
+  }
+
+  .action-buttons {
+    flex-direction: column;
+  }
+
+  .page-navigation {
+    flex-direction: column;
+    gap: var(--space-sm);
+  }
+
+  .page-navigation .btn {
+    justify-content: center;
+  }
+}
+
+@media (max-width: 480px) {
+  .page-header {
+    padding: var(--space-lg);
+  }
+
+  .page-title {
+    font-size: var(--text-2xl);
+  }
+
+  .card-header {
+    padding: var(--space-lg);
+  }
+
+  .table-cell {
+    padding: var(--space-sm);
+  }
+
+  .objects-table {
+    font-size: var(--text-xs);
+  }
+}
+</style>
\ No newline at end of file