diff --git a/src/components/deal/DealModal.vue b/src/components/deal/DealModal.vue
index 89d9cf3..de6aa63 100644
--- a/src/components/deal/DealModal.vue
+++ b/src/components/deal/DealModal.vue
@@ -371,8 +371,8 @@
             :urlLaravel="urlLaravel"
             @remove="removeDoc"
         />
-        <div class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4">
-          <button @click="openModalDealDoc" class="w-full h-full p-6 rounded flex flex-col items-center justify-center add-deal-doc-button">
+        <div class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4 pr-4 mb-4">
+          <button @click="openModalDealDoc" class="w-full h-full p-4 rounded flex flex-col items-center justify-center add-deal-doc-button">
             <img src="@/shared/assets/icons/plus-green.svg" alt="Добавить документ" class="w-6 h-6">
             <p>Добавить документ</p>
           </button>
@@ -651,6 +651,7 @@ async function loadDealData(dealId) {
         id: doc.id,
         name: doc.name,
         file: doc.file,
+        thumbnail: doc.thumbnail,
         created_at: doc.created_at
       }));
     } else {
diff --git a/src/components/deal/addEdit/DocAddModal.vue b/src/components/deal/addEdit/DocAddModal.vue
index b1eb0e7..407693d 100644
--- a/src/components/deal/addEdit/DocAddModal.vue
+++ b/src/components/deal/addEdit/DocAddModal.vue
@@ -77,9 +77,10 @@
 </template>
 
 <script setup>
-import {inject, ref} from 'vue';
+import { inject, ref } from 'vue';
 //import { useLaravelApi } from '@/composables/useLaravelApi';
 import { dealsApi } from '@/shared/api/deal';
+import { generateThumbnail } from '@/shared/utils/generateThumbnail';
 import InputText from "primevue/inputtext";
 import FileUpload from 'primevue/fileupload';
 import Button from 'primevue/button';
@@ -139,8 +140,6 @@ const saveDealDoc = async () => {
     return;
   }
 
-  //const { fetchData } = useLaravelApi();
-
   // Создаем FormData для отправки файла
   const formData = new FormData();
   formData.append('name', documentName.value);
@@ -148,8 +147,17 @@ const saveDealDoc = async () => {
   if (props.deal.id) {
     formData.append('target_id', props.deal.id);
   }
+  formData.append('target_type', 10);
 
-  formData.append('target_type', 10); // Пример значения
+  // Генерируем thumbnail
+  try {
+    const thumbnail = await generateThumbnail(selectedFile.value);
+    if (thumbnail) {
+      formData.append('thumbnail', thumbnail.blob, 'thumb.' + thumbnail.extension);
+    }
+  } catch (e) {
+    console.error('[DocAddModal] Thumbnail generation failed:', e);
+  }
 
   try {
     const response = await dealsApi.uploadDocument(formData);
@@ -160,27 +168,10 @@ const saveDealDoc = async () => {
       life: 3000
     });
     dialogRef.value.close(response.data.data)
-    //closeModal();
   } catch (error) {
     console.error('Ошибка при загрузке документа:', error);
     alert('Произошла ошибка при загрузке документа');
   }
-
-  // try {
-  //   const response = await fetchData('/documents', {
-  //     method: 'POST',
-  //     data: formData,
-  //   });
-  //
-  //   // Передаем документ в родительский компонент
-  //   emit('select', response.data.data);
-  //
-  //   // Закрываем модальное окно
-  //   closeModal();
-  // } catch (error) {
-  //   console.error('Ошибка при загрузке документа:', error);
-  //   alert('Произошла ошибка при загрузке документа');
-  // }
 };
 
 </script>
diff --git a/src/components/deal/addEdit/DocsCard.vue b/src/components/deal/addEdit/DocsCard.vue
index dbf6a5e..0d923d8 100644
--- a/src/components/deal/addEdit/DocsCard.vue
+++ b/src/components/deal/addEdit/DocsCard.vue
@@ -1,14 +1,13 @@
 <template>
-  <div class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4 pr-4">
+  <div class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4 pr-4 mb-4">
     <div class="document-card p-4 rounded flex">
       <div class="deal-document-thumbnail w-16 h-16 shrink-0 rounded-lg overflow-hidden">
-        <img v-if="isImage" :src="fileUrl" alt="Превью документа" class="w-full h-full object-cover" />
-
+        <img v-if="hasThumbnail" :src="thumbnailUrl" alt="Миниатюра документа" class="w-full h-full object-cover" />
+        <img v-else-if="isImage" :src="fileUrl" alt="Превью документа" class="w-full h-full object-cover" />
         <img v-else
              :src="defaultIconUrl"
              :alt="fileExtension + ' документ'"
              class="w-full h-full object-contain bg-gray-100" />
-
       </div>
 
       <!-- Название документа -->
@@ -54,6 +53,15 @@ const fileUrl = computed(() => {
   return `${props.urlLaravel}/storage/${props.doc.file}`;
 });
 
+const hasThumbnail = computed(() => {
+  return !!props.doc.thumbnail;
+});
+
+const thumbnailUrl = computed(() => {
+  if (!props.doc.thumbnail) return '';
+  return `${props.urlLaravel}/storage/${props.doc.thumbnail}`;
+});
+
 // // Проверка, является ли файл изображением
 const isImage = computed(() => {
   if (!props.doc.file) return false;