feat: обновил шаблон отзыва и улучшил анализ отзывов преподавателя

frontend/src/views/teacher/TeacherAnalyticsView.vue

@@ -9,7 +9,6 @@ import { mapApiReview } from '@/api/mappers'
 import { useLecturesStore } from '@/stores/lectures'
 import { useAuthStore } from '@/stores/auth'
 
-const ratingTrend = [4.2, 4.5, 4.6, 4.8, 4.7]
 const lecturesStore = useLecturesStore()
 const auth = useAuthStore()
 const reviews = ref<Review[]>([])
@@ -17,8 +16,9 @@ const reviews = ref<Review[]>([])
 const positive = computed(() => reviews.value.filter((r) => r.sentiment === 'positive').length)
 const neutral = computed(() => reviews.value.filter((r) => r.sentiment === 'neutral').length)
 const negative = computed(() => reviews.value.filter((r) => r.sentiment === 'negative').length)
-const total = computed(() => reviews.value.length || 1)
-const pct = (value: number) => Math.round((value / total.value) * 100)
+const total = computed(() => reviews.value.length)
+const pct = (value: number) => (total.value ? Math.round((value / total.value) * 100) : 0)
+const ratio = (value: number) => `${value}/${total.value}`
 
 async function fetchTeacherAnalytics() {
   if (!auth.user?.id) return
@@ -39,37 +39,28 @@ watch(() => auth.user?.id, fetchTeacherAnalytics)
     <h1 class="page-title">Аналитика преподавателя</h1>
 
     <div class="grid">
-      <GlassCard>
-        <div class="section-title">Динамика оценок</div>
-        <div class="chart">
-          <div v-for="(value, i) in ratingTrend" :key="i" class="bar">
-            <div class="bar-fill" :style="{ height: `${value * 18}px` }"></div>
-            <span class="bar-label">Нед {{ i + 1 }}</span>
-          </div>
-        </div>
-        <div class="avg">Средняя оценка: 4.6</div>
-      </GlassCard>
-
       <GlassCard>
         <div class="section-title">Sentiment-анализ отзывов</div>
         <div class="sentiment">
           <div>
-            <div class="sentiment-label">Позитивные {{ pct(positive) }}%</div>
-            <ProgressBar :value="pct(positive)" :max="100" />
+            <div class="sentiment-label">Позитивные {{ ratio(positive) }}</div>
+            <ProgressBar :value="pct(positive)" :max="100" :text="ratio(positive)" />
           </div>
           <div>
-            <div class="sentiment-label">Нейтральные {{ pct(neutral) }}%</div>
+            <div class="sentiment-label">Нейтральные {{ ratio(neutral) }}</div>
             <ProgressBar
               :value="pct(neutral)"
               :max="100"
+              :text="ratio(neutral)"
               color="linear-gradient(90deg, #7DD3FC, #BAE6FD)"
             />
           </div>
           <div>
-            <div class="sentiment-label">Негативные {{ pct(negative) }}%</div>
+            <div class="sentiment-label">Негативные {{ ratio(negative) }}</div>
             <ProgressBar
               :value="pct(negative)"
               :max="100"
+              :text="ratio(negative)"
               color="linear-gradient(90deg, #FCA5A5, #FECACA)"
             />
           </div>
@@ -117,32 +108,6 @@ watch(() => auth.user?.id, fetchTeacherAnalytics)
   grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
   gap: 16px;
 }
-.chart {
-  display: flex;
-  gap: 12px;
-  align-items: flex-end;
-  height: 160px;
-  padding: 10px 0;
-}
-.bar {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 6px;
-}
-.bar-fill {
-  width: 26px;
-  border-radius: 6px 6px 0 0;
-  background: linear-gradient(180deg, #22c55e, #86efac);
-}
-.bar-label {
-  font-size: 11px;
-  color: var(--color-text-secondary);
-}
-.avg {
-  margin-top: 6px;
-  font-weight: 600;
-}
 .sentiment {
   display: flex;
   flex-direction: column;