diff --git a/src/components/News_section/NewsCard.vue b/src/components/News_section/NewsCard.vue
index c684d91..8b1652b 100644
--- a/src/components/News_section/NewsCard.vue
+++ b/src/components/News_section/NewsCard.vue
@@ -30,6 +30,7 @@ const props = defineProps({
   svodka: Boolean,
   donesenie: Boolean,
   bilutene: Boolean,
+  download: Boolean,
 });
 
 const { isDark } = useDarkMode();
diff --git a/src/components/Settings_section/Settings.vue b/src/components/Settings_section/Settings.vue
index 28d1fbb..e6e8fdc 100644
--- a/src/components/Settings_section/Settings.vue
+++ b/src/components/Settings_section/Settings.vue
@@ -126,6 +126,13 @@
     >
       <SettingsDownloads />
     </div>
+
+    <!-- Счётчики для выгрузки -->
+    <div
+      class="dark:bg-gray-800 mt-5 sm:m-5 bg-white p-4 hover:-translate-y-2 hover:shadow-2xl border-slate-100 rounded-xl transition"
+    >
+      <SettingsDownloadsCounts />
+    </div>
   </div>
 </template>
 
@@ -142,6 +149,7 @@ import {
 } from '@/services/settingsService.js'
 import { getTodayDate } from '@/utils/date.js'
 import SettingsDownloads from './SettingsDownloads.vue'
+import SettingsDownloadsCounts from './SettingsDownloadsCounts.vue'
 import DatePicker from './DatePicker.vue'
 
 const sources = ref([{ name: '', promt: '' }])
diff --git a/src/components/Settings_section/SettingsDownloadsCounts.vue b/src/components/Settings_section/SettingsDownloadsCounts.vue
new file mode 100644
index 0000000..f70201b
--- /dev/null
+++ b/src/components/Settings_section/SettingsDownloadsCounts.vue
@@ -0,0 +1,88 @@
+<template>
+  <div>
+    <button
+      type="button"
+      @click="toggleCounts"
+      class="dark:bg-orange-500 hover:dark:bg-orange-600 shadow text-white bg-sky-700 w-full hover:bg-sky-900 rounded-xl px-2 min-h-11 cursor-pointer"
+    >
+      {{ showCounts ? 'Скрыть счётчики' : 'Показать счётчики' }}
+    </button>
+
+    <div v-if="showCounts && !loading" class="border border-neutral-300 p-4 mt-2 rounded-xl">
+      <div class="grid grid-cols-2 sm:grid-cols-4 gap-3">
+        <div 
+          v-for="(count, key) in counts" 
+          :key="key"
+          class="flex flex-col items-center p-3 rounded-xl transition-colors"
+          :class="{
+            'bg-green-100 dark:bg-green-900': count > 0,
+            'bg-gray-100 dark:bg-gray-700': count === 0
+          }"
+        >
+          <span class="text-2xl font-bold" :class="count > 0 ? 'text-green-600 dark:text-green-400' : 'text-gray-500 dark:text-gray-400'">
+            {{ count }}
+          </span>
+          <span class="text-sm text-neutral-600 dark:text-neutral-300 mt-1">
+            {{ labels[key] }}
+          </span>
+        </div>
+      </div>
+      
+      <div class="mt-4 text-center text-sm text-neutral-500 dark:text-neutral-400">
+        Всего статей к выгрузке: <span class="font-bold">{{ totalCount }}</span>
+      </div>
+    </div>
+
+    <div v-if="showCounts && loading" class="flex justify-center items-center p-8 mt-2">
+      <div class="animate-spin rounded-full h-8 w-8 border-b-2 border-sky-700"></div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, computed, onMounted } from 'vue'
+import { fetchDownloadCounts } from '@/services/settingsService.js'
+
+const showCounts = ref(false)
+const loading = ref(false)
+const counts = ref({
+  tematik: 0,
+  svodka: 0,
+  donesenie: 0,
+  bilutene: 0
+})
+
+const labels = {
+  tematik: 'Тематическая',
+  svodka: 'Сводка',
+  donesenie: 'Донесение',
+  bilutene: 'Билутень',
+}
+
+const totalCount = computed(() => {
+  return Object.values(counts.value).reduce((sum, count) => sum + count, 0)
+})
+
+function toggleCounts() {
+  showCounts.value = !showCounts.value
+  if (showCounts.value && !loading.value && totalCount.value === 0) {
+    loadCounts()
+  }
+}
+
+async function loadCounts() {
+  loading.value = true
+  try {
+    const data = await fetchDownloadCounts()
+    counts.value = data
+  } catch (error) {
+    console.error('Ошибка при загрузке счётчиков:', error)
+  } finally {
+    loading.value = false
+  }
+}
+
+onMounted(() => {
+  loadCounts()
+})
+</script>
diff --git a/src/services/settingsService.js b/src/services/settingsService.js
index c2a9d00..b168216 100644
--- a/src/services/settingsService.js
+++ b/src/services/settingsService.js
@@ -38,3 +38,8 @@ export async function downloadAll(dataStart, dataFinish, fieldName) {
     { responseType: 'blob' },
   )
 }
+
+export async function fetchDownloadCounts() {
+  const { data } = await api8001.get('/download_counts')
+  return data
+}