fix(catalog): restore price charts on nested pages

Keep charts with simplified headers (no text clutter)

app/pages/catalog/hubs/[id]/[productId].vue

@@ -44,6 +44,20 @@
 
         <template #header>
           <Text v-if="sources.length === 0 && !isLoadingRoutes" tone="muted">Нет доступных источников</Text>
+          <Stack v-else gap="4">
+            <Card padding="md">
+              <div class="h-48">
+                <ClientOnly>
+                  <apexchart
+                    type="area"
+                    height="180"
+                    :options="chartOptions"
+                    :series="chartSeries"
+                  />
+                </ClientOnly>
+              </div>
+            </Card>
+          </Stack>
         </template>
 
         <template #card="{ item }">
@@ -126,6 +140,54 @@ const handleRemoveFilter = (filterId: string) => {
   }
 }
 
+// Mock price history generator (seeded by uuid for consistent results)
+const getMockPriceHistory = (uuid: string): number[] => {
+  const seed = uuid.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0)
+  const basePrice = 100 + (seed % 200)
+  return Array.from({ length: 30 }, (_, i) => {
+    const variation = Math.sin(seed + i * 0.3) * 30 + Math.cos(seed * 0.2 + i) * 15
+    return Math.round(basePrice + variation)
+  })
+}
+
+// Chart configuration
+const priceHistory = computed(() => getMockPriceHistory(productId.value))
+
+const trend = computed(() => {
+  if (priceHistory.value.length < 2) return 0
+  const first = priceHistory.value[0]
+  const last = priceHistory.value[priceHistory.value.length - 1]
+  if (!first || first === 0) return 0
+  return Math.round(((last - first) / first) * 100)
+})
+
+const chartOptions = computed(() => ({
+  chart: {
+    type: 'area',
+    toolbar: { show: false },
+    animations: { enabled: true }
+  },
+  stroke: { curve: 'smooth', width: 2 },
+  fill: {
+    type: 'gradient',
+    gradient: { shadeIntensity: 1, opacityFrom: 0.4, opacityTo: 0.1 }
+  },
+  colors: [trend.value >= 0 ? '#22c55e' : '#ef4444'],
+  dataLabels: { enabled: false },
+  xaxis: {
+    categories: priceHistory.value.map((_, i) => `${i + 1}`),
+    labels: { show: false }
+  },
+  yaxis: { labels: { formatter: (val: number) => `$${val}` } },
+  tooltip: { y: { formatter: (val: number) => `$${val}` } },
+  grid: { borderColor: '#e5e7eb', strokeDashArray: 4 }
+}))
+
+const chartSeries = computed(() => [{
+  name: t('catalogHub.product.price'),
+  data: priceHistory.value
+}])
+
 // Transform sources for CatalogPage
 const sources = computed(() => {
   return rawSources.value.map(source => ({