.

src/components/marketing/PptFunnel.vue

@@ -1,7 +1,10 @@
 <template>
     <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
         <div class="flex items-center justify-between mb-3">
-            <div class="text-[15px] font-semibold text-slate-800">{{ title }}</div>
+            <div class="flex items-center gap-1.5">
+                <div class="text-[15px] font-semibold text-slate-800">{{ title }}</div>
+                <i v-if="description" class="pi pi-question-circle text-[12px] text-slate-400 cursor-help" v-tooltip.top="description"></i>
+            </div>
             <div v-if="subtitle" class="text-[12px] text-slate-500">{{ subtitle }}</div>
         </div>
 
@@ -37,6 +40,7 @@ import { computed } from 'vue';
 const props = defineProps({
     title: { type: String, default: 'Потери на воронке' },
     subtitle: { type: String, default: '' },
+    description: { type: String, default: '' },
     steps: {
         type: Array,
         required: true
@@ -97,4 +101,3 @@ function badgeY(index) {
     return y + stageH + (gap - 22) / 2;
 }
 </script>
-

src/components/marketing/PptKpiCard.vue

@@ -10,9 +10,12 @@
                         <div class="h-10 w-10 rounded-xl flex items-center justify-center shadow-sm border border-white/50" :style="{ background: iconBg, color: accentColor }">
                             <i class="pi" :class="icon"></i>
                         </div>
-                        <div class="min-w-0">
-                            <div class="text-[13px] font-semibold text-slate-800 truncate">{{ title }}</div>
-                            <div v-if="subtitle" class="text-[12px] text-slate-500 truncate">{{ subtitle }}</div>
+                        <div class="min-w-0 flex-1">
+                            <div class="flex items-center gap-1.5">
+                                <div class="text-[13px] font-semibold text-slate-800 truncate">{{ title }}</div>
+                                <i v-if="description" class="pi pi-question-circle text-[12px] text-slate-400 cursor-help flex-shrink-0" v-tooltip.top="description"></i>
+                            </div>
+                            <div v-if="subtitle" class="text-[12px] text-slate-500 truncate mt-0.5">{{ subtitle }}</div>
                         </div>
                     </div>
                 </div>
@@ -45,7 +48,8 @@ const props = defineProps({
     subtitle: { type: String, default: '' },
     icon: { type: String, default: 'pi-chart-line' },
     accentColor: { type: String, default: '#5B89FF' },
-    trendText: { type: String, default: '' }
+    trendText: { type: String, default: '' },
+    description: { type: String, default: '' }
 });
 
 function hexToRgba(hex, alpha) {