extract DownloadImageButton.vue

src/views/ManageQRCodeReadyView.vue

@@ -32,11 +32,13 @@
             :download="`${sanitizedFileName}.svg`"
             as="a"
           />
-          <Button
+
+          <DownloadImageButton
+            :svgUrl="svgQueryData"
+            :filename="`${sanitizedFileName}.png`"
             label="Скачать PNG"
-            icon="pi pi-download"
-            class="p-button-sm p-button-outlined"
-            @click="downloadPng"
+            type="image/png"
+            :width="width"
           />
         </div>
 
@@ -70,7 +72,6 @@ import { optimizeSvg } from '@/utils/images/svg/optimizeSvg'
 import { replaceFillInSvg } from '@/utils/images/svg/replaceFillInSvg'
 import { getQrCodeDocument } from '@/api/qrCode'
 import { type QRCodeDocument } from '@/types/DBDocumentTypes'
-import { downloadImage } from '@/utils/images/downloadImage'
 import { addLabelToSvg } from '@/utils/images/svg/addLabelToSvg'
 import logo from '@/assets/logo.svg?raw'
 
@@ -161,21 +162,4 @@ const {
     }
   },
 })
-
-// Скачивание PNG
-async function downloadPng() {
-  try {
-    if (!svgQueryData.value) {
-      throw new Error('SVG не загружен')
-    }
-    await downloadImage({
-      type: 'image/png',
-      filename: `${sanitizedFileName.value}.png`,
-      width: width.value,
-      url: svgQueryData.value,
-    })
-  } catch (err) {
-    console.error('Ошибка скачивания PNG:', err)
-  }
-}
 </script>