PDF Download

2026-03-13 21:19:52 +01:00
parent 7973d4563e
commit 8a9295c309
17 changed files with 182 additions and 423 deletions
--- a/api/package-lock.json
+++ b/api/package-lock.json
@@ -186,24 +186,6 @@
        "url": "https://github.com/sponsors/epoberezkin"
      }
    },
-    "node_modules/@angular-devkit/schematics-cli/node_modules/chokidar": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-4.0.3.tgz",
-      "integrity": "sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==",
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "peer": true,
-      "dependencies": {
-        "readdirp": "^4.0.1"
-      },
-      "engines": {
-        "node": ">= 14.16.0"
-      },
-      "funding": {
-        "url": "https://paulmillr.com/funding/"
-      }
-    },
    "node_modules/@angular-devkit/schematics-cli/node_modules/json-schema-traverse": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
@@ -211,22 +193,6 @@
      "dev": true,
      "license": "MIT"
    },
-    "node_modules/@angular-devkit/schematics-cli/node_modules/readdirp": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-4.1.2.tgz",
-      "integrity": "sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==",
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "peer": true,
-      "engines": {
-        "node": ">= 14.18.0"
-      },
-      "funding": {
-        "type": "individual",
-        "url": "https://paulmillr.com/funding/"
-      }
-    },
    "node_modules/@angular-devkit/schematics-cli/node_modules/rxjs": {
      "version": "7.8.1",
      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz",
@@ -282,24 +248,6 @@
        "url": "https://github.com/sponsors/epoberezkin"
      }
    },
-    "node_modules/@angular-devkit/schematics/node_modules/chokidar": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-4.0.3.tgz",
-      "integrity": "sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==",
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "peer": true,
-      "dependencies": {
-        "readdirp": "^4.0.1"
-      },
-      "engines": {
-        "node": ">= 14.16.0"
-      },
-      "funding": {
-        "url": "https://paulmillr.com/funding/"
-      }
-    },
    "node_modules/@angular-devkit/schematics/node_modules/json-schema-traverse": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
@@ -307,22 +255,6 @@
      "dev": true,
      "license": "MIT"
    },
-    "node_modules/@angular-devkit/schematics/node_modules/readdirp": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-4.1.2.tgz",
-      "integrity": "sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==",
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "peer": true,
-      "engines": {
-        "node": ">= 14.18.0"
-      },
-      "funding": {
-        "type": "individual",
-        "url": "https://paulmillr.com/funding/"
-      }
-    },
    "node_modules/@angular-devkit/schematics/node_modules/rxjs": {
      "version": "7.8.1",
      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz",
@@ -3609,24 +3541,6 @@
        "url": "https://github.com/sponsors/epoberezkin"
      }
    },
-    "node_modules/@nestjs/schematics/node_modules/chokidar": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-4.0.3.tgz",
-      "integrity": "sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==",
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "peer": true,
-      "dependencies": {
-        "readdirp": "^4.0.1"
-      },
-      "engines": {
-        "node": ">= 14.16.0"
-      },
-      "funding": {
-        "url": "https://paulmillr.com/funding/"
-      }
-    },
    "node_modules/@nestjs/schematics/node_modules/json-schema-traverse": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
@@ -3634,22 +3548,6 @@
      "dev": true,
      "license": "MIT"
    },
-    "node_modules/@nestjs/schematics/node_modules/readdirp": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-4.1.2.tgz",
-      "integrity": "sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==",
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "peer": true,
-      "engines": {
-        "node": ">= 14.18.0"
-      },
-      "funding": {
-        "type": "individual",
-        "url": "https://paulmillr.com/funding/"
-      }
-    },
    "node_modules/@nestjs/schematics/node_modules/rxjs": {
      "version": "7.8.1",
      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz",
--- a/api/src/app.module.ts
+++ b/api/src/app.module.ts
@@ -11,12 +11,10 @@ import { KeyModule } from './modules/key/key.module';
 import { CustomerModule } from './modules/customer/customer.module';
 import { CylinderModule } from './modules/cylinder/cylinder.module';
 import { SystemModule } from './modules/system/system.module';
-import { CacheInterceptor, CacheModule } from '@nestjs/cache-manager';
-import { APP_INTERCEPTOR } from '@nestjs/core';
 import { MailModule } from './modules/mail/mail.module';
 import { LogModule } from './modules/log/log.module';
 import { SseModule } from './modules/realtime/sse/sse.module';
-import { PdfModule } from './shared/pdf/pdf.module';
+import { StorageModule } from './shared/storage/storage.module';

@Module({
  imports: [
@@ -36,7 +34,7 @@ import { PdfModule } from './shared/pdf/pdf.module';
    MailModule,
    LogModule,
    SseModule,
-    PdfModule
+    StorageModule
  ],
  controllers: [AppController],
  providers: [
--- a/api/src/model/dto/key-handover.dto.ts
+++ b/api/src/model/dto/key-handover.dto.ts
@@ -1,4 +1,4 @@
-export class KeyHandoverDto {
+export class KeyHandoverPDFDataDto {
  handoverId!: string;
  handoverDate!: Date;
  place!: string;
--- a/api/src/modules/key/key.controller.ts
+++ b/api/src/modules/key/key.controller.ts
@@ -16,14 +16,12 @@ import { KeyService } from './key.service';
 import { AuthenticatedRequest } from 'src/model/interface/authenticated-request.interface';
 import { AuthGuard } from 'src/core/guards/auth.guard';
 import { Key } from 'src/model/entitites';
-import { interval, map, Observable } from 'rxjs';
-import { KeyHandoverPdfService } from 'src/shared/pdf/key-handover-pdf/key-handover-pdf.service';
-import { KeyHandoverDto } from 'src/model/dto/key-handover.dto';
+import { KeyHandoverPDFDataDto } from 'src/model/dto/key-handover.dto';


@Controller('key')
 export class KeyController {
-  constructor(private service: KeyService, private pdfService: KeyHandoverPdfService) {}
+  constructor(private service: KeyService) {}

  @UseGuards(AuthGuard)
  @Get()
@@ -84,11 +82,45 @@ export class KeyController {
  }

  @Post('pdf')
-  async generatePdf(@Body() dto: KeyHandoverDto, @Res() res: Response) {
-    const pdfBuffer = await this.service.fetchPdf(dto);
+  async generatePdf(@Body() dto: KeyHandoverPDFDataDto, @Res() res: Response) {
+    const { pdf, response } = await this.service.createPdf(dto);

-    res.setHeader('Content-Type', 'application/pdf');
-    res.setHeader('Content-Disposition', 'inline; filename="uebergabe.pdf"');
-    res.send(pdfBuffer);
+    res.setHeader(
+    'Content-Type',
+    response.headers['content-type'] ?? 'application/pdf',
+  );
+
+  if (response.headers['content-length']) {
+    res.setHeader('Content-Length', response.headers['content-length']);
+  }
+
+  if (response.headers['content-disposition']) {
+    res.setHeader('Content-Disposition', response.headers['content-disposition']);
+  } else {
+    res.setHeader('Content-Disposition', `inline; filename="uebergabe.pdf"`);
+  }
+
+  res.end(pdf);
+  }
+
+  @Get(':id/handover/pdf')
+  async getHandoverPDF(@Param('id') id: string, @Res() res: Response) {
+    const { pdf, response } = await this.service.getPdf(id);
+    res.setHeader(
+    'Content-Type',
+    response.headers['content-type'] ?? 'application/pdf',
+    );
+
+    if (response.headers['content-length']) {
+      res.setHeader('Content-Length', response.headers['content-length']);
+    }
+
+    if (response.headers['content-disposition']) {
+      res.setHeader('Content-Disposition', response.headers['content-disposition']);
+    } else {
+      res.setHeader('Content-Disposition', `inline; filename="uebergabe.pdf"`);
+    }
+
+    res.end(pdf);
  }
 }
--- a/api/src/modules/key/key.module.ts
+++ b/api/src/modules/key/key.module.ts
@@ -7,12 +7,12 @@ import { SharedServiceModule } from 'src/shared/service/shared.service.module';
 import { ConfigService } from '@nestjs/config';
 import { MailModule } from '../mail/mail.module';
 import { SseModule } from '../realtime/sse/sse.module';
-import { PdfModule } from 'src/shared/pdf/pdf.module';
 import { HttpModule } from '@nestjs/axios';
+import { StorageModule } from 'src/shared/storage/storage.module';

@Module({
  controllers: [KeyController],
  providers: [KeyService, ConfigService],
-  imports: [DatabaseModule, AuthModule, SharedServiceModule, MailModule, SseModule, PdfModule, HttpModule],
+  imports: [DatabaseModule, AuthModule, SharedServiceModule, MailModule, SseModule, HttpModule, StorageModule],
 })
 export class KeyModule {}
--- a/api/src/modules/key/key.service.ts
+++ b/api/src/modules/key/key.service.ts
@@ -12,9 +12,11 @@ import { FindOperator, IsNull, Not } from 'typeorm';
 import { ConfigService } from '@nestjs/config';
 import { MailService } from '../mail/mail.service';
 import { SseService } from '../realtime/sse/sse.service';
-import { KeyHandoverDto } from 'src/model/dto/key-handover.dto';
+import { KeyHandoverPDFDataDto } from 'src/model/dto/key-handover.dto';
 import { firstValueFrom } from 'rxjs';
 import { HttpService } from '@nestjs/axios';
+import { PdfService } from 'src/shared/storage/services/pdf/pdf.service';
+import { AxiosResponse } from 'axios';

@Injectable()
 export class KeyService {
@@ -27,7 +29,8 @@ export class KeyService {
    private readonly configService: ConfigService,
    private readonly mailService: MailService,
    private readonly sseService: SseService,
-    private readonly httpService: HttpService
+    private readonly httpService: HttpService,
+    private readonly pdfService: PdfService
  ) {
    console.log("INIT KEYSERVICE")
  }
@@ -234,13 +237,12 @@ export class KeyService {
    return k;
  }

-  async fetchPdf(dto: KeyHandoverDto): Promise<Buffer> {
-    const response = await firstValueFrom(
-      this.httpService.post<any>('http://192.168.30.101:3500/pdf/keyhandover',dto, {
-        responseType: 'arraybuffer',
-      }),
-    );
+  async createPdf(dto: KeyHandoverPDFDataDto): Promise<{ pdf: Buffer, response: AxiosResponse}> {
+    const x = await this.pdfService.generatePDF(dto)
+    return x;
+  }

-    return Buffer.from(response.data);
+  async getPdf(handoverId: string): Promise<{ pdf: Buffer, response: AxiosResponse}> {
+    return this.pdfService.getPDFByHandoverKey(handoverId);
  }
 }
--- a/api/src/shared/pdf/key-handover-pdf/key-handover-pdf.service.ts
+++ b/api/src/shared/pdf/key-handover-pdf/key-handover-pdf.service.ts
@@ -1,250 +0,0 @@
-import { Injectable } from '@nestjs/common';
-import { KeyHandoverDto } from 'src/model/dto/key-handover.dto';
-import * as puppeteer from 'puppeteer';
-import { MinioService } from '../minio/minio.service';
-import { KeyHandoutRepository } from 'src/model/repositories/key-handout.repository';
-import { KeyHandout } from 'src/model/entitites';
-import { ConfigService } from '@nestjs/config';
-
-@Injectable()
-export class KeyHandoverPdfService {
-
-  constructor(private readonly minioService: MinioService, private handoverRepo: KeyHandoutRepository, private configService: ConfigService) {}
-
-  async generatePdf(dto: KeyHandoverDto): Promise<Buffer> {
-    const browser = await puppeteer.launch({
-      headless: true,
-      executablePath: '/usr/bin/chromium',
-      args: ['--no-sandbox', '--disable-setuid-sandbox'],
-    });
-
-    try {
-      const page = await browser.newPage();
-
-      const html = this.buildHtml(dto);
-
-      await page.setContent(html, {
-        waitUntil: 'networkidle0',
-      });
-
-      const pdf = await page.pdf({
-        format: 'A4',
-        printBackground: true,
-        margin: {
-          top: '20mm',
-          right: '15mm',
-          bottom: '20mm',
-          left: '15mm',
-        },
-        displayHeaderFooter: true,
-        headerTemplate: `<div></div>`,
-        footerTemplate: `
-          <div style="
-            width: 100%;
-            font-size: 10px;
-            padding: 0 20px;
-            color: #666;
-            display: flex;
-            justify-content: space-between;
-          ">
-            <span>Übergabeprotokoll</span>
-            <span>${new Date().toLocaleString()}</span>
-          </div>
-        `,
-      });
-
-      const buffer = Buffer.from(pdf);
-
-      const bucket = this.configService.get('MINIOBUCKET');
-      const key = `handover-forms/${Date.now()}-schluesseluebergabe.pdf`;
-      await this.minioService.uploadPdf(bucket, key, buffer);
-      await this.saveKeyToHandover(dto.handoverId, key)
-      return buffer;
-    } finally {
-      await browser.close();
-    }
-  }
-
-  private async saveKeyToHandover(handoverId: string, fileKey: string) {
-    const handover: KeyHandout = await this.handoverRepo.findOneBy({ id: handoverId });
-    if (!handover) { return; }
-    handover.pdfFormKey = fileKey;
-    this.handoverRepo.save(handover);
-  }
-
-  private buildHtml(dto: KeyHandoverDto): string {
-    return `
-      <!doctype html>
-      <html lang="de">
-        <head>
-          <meta charset="UTF-8" />
-          <title>Übergabeprotokoll</title>
-          <style>
-            body {
-              font-family: Arial, Helvetica, sans-serif;
-              font-size: 12px;
-              color: #222;
-              margin: 0;
-              padding: 0;
-            }
-
-            h1 {
-              text-align: center;
-              margin: 0 0 24px 0;
-              font-size: 22px;
-            }
-
-            .section {
-              margin-bottom: 18px;
-            }
-
-            .section-title {
-              font-weight: bold;
-              font-size: 14px;
-              margin-bottom: 8px;
-              border-bottom: 1px solid #ccc;
-              padding-bottom: 4px;
-            }
-
-            .row {
-              margin-bottom: 6px;
-            }
-
-            .label {
-              display: inline-block;
-              width: 170px;
-              font-weight: bold;
-              vertical-align: top;
-            }
-
-            .value {
-              display: inline-block;
-              max-width: 360px;
-              word-break: break-word;
-            }
-
-            .note-box {
-              min-height: 60px;
-              border: 1px solid #ccc;
-              padding: 8px;
-              margin-top: 6px;
-              white-space: pre-wrap;
-            }
-
-            .declaration {
-              margin-top: 24px;
-              line-height: 1.5;
-            }
-
-            .signature-wrapper {
-              margin-top: 60px;
-              display: flex;
-              justify-content: space-between;
-              gap: 40px;
-            }
-
-            .signature-block {
-              width: 45%;
-            }
-
-            .signature-line {
-              border-top: 1px solid #000;
-              margin-top: 50px;
-              padding-top: 6px;
-              text-align: center;
-            }
-          </style>
-        </head>
-        <body>
-          <h1>Übergabeprotokoll</h1>
-
-          <div class="section">
-            <div class="section-title">Übergabedaten</div>
-            <div class="row">
-              <span class="label">Datum der Übergabe:</span>
-              <span class="value">${this.escapeHtml(new Date(dto.handoverDate).toLocaleDateString())}</span>
-            </div>
-            <div class="row" style="display: none">
-              <span class="label">Ort:</span>
-              <span class="value">${this.escapeHtml(dto.place)}</span>
-            </div>
-          </div>
-
-          <div class="section">
-            <div class="section-title">Übergeber</div>
-            <div class="row">
-              <span class="label">Name:</span>
-              <span class="value">${this.escapeHtml(dto.giverName)}</span>
-            </div>
-            <div class="row">
-              <span class="label">Adresse:</span>
-              <span class="value">${this.escapeHtml(dto.giverAddress ?? '-')}</span>
-            </div>
-          </div>
-
-          <div class="section">
-            <div class="section-title">Empfänger</div>
-            <div class="row">
-              <span class="label">Name:</span>
-              <span class="value">${this.escapeHtml(dto.receiverName)}</span>
-            </div>
-            <div class="row">
-              <span class="label">Adresse:</span>
-              <span class="value">${this.escapeHtml(dto.receiverAddress ?? '-')}</span>
-            </div>
-          </div>
-
-          <div class="section">
-            <div class="section-title">Schlüsselangaben</div>
-            <div class="row" style="display: none;">
-              <span class="label">Schlüsselart:</span>
-              <span class="value">${this.escapeHtml(dto.keyType)}</span>
-            </div>
-            <div class="row">
-              <span class="label">Schlüsselnummer:</span>
-              <span class="value">${this.escapeHtml(dto.keyNumber ?? '-')}</span>
-            </div>
-            <div class="row" style="display: none;">
-              <span class="label">Anzahl:</span>
-              <span class="value">${dto.quantity}</span>
-            </div>
-            <div class="row">
-              <span class="label">Objekt / Raum:</span>
-              <span class="value">${this.escapeHtml(dto.objectDescription ?? '-')}</span>
-            </div>
-            <div class="row">
-              <span class="label">Bemerkungen:</span>
-            </div>
-            <div class="note-box">${this.escapeHtml(dto.notes ?? '-')}</div>
-            
-          </div>
-
-          <div class="declaration">
-            Hiermit bestätigt der Empfänger den Erhalt der oben aufgeführten Schlüssel.
-            <br />
-            Mit ihrer Unterschrift bestätigen beide Parteien die ordnungsgemäße Übergabe.
-          </div>
-
-          <div class="signature-wrapper">
-            <div class="signature-block">
-              <div class="signature-line">Unterschrift Übergeber</div>
-            </div>
-            <div class="signature-block">
-              <div class="signature-line">Unterschrift Empfänger</div>
-            </div>
-          </div>
-        </body>
-      </html>
-    `;
-  }
-
-  private escapeHtml(value: string): string {
-    if (!value) { return ""; }
-    return value
-      .replace(/&/g, '&amp;')
-      .replace(/</g, '&lt;')
-      .replace(/>/g, '&gt;')
-      .replace(/"/g, '&quot;')
-      .replace(/'/g, '&#39;');
-  }
-}
--- a/api/src/shared/pdf/minio/minio.service.ts
+++ b/api/src/shared/pdf/minio/minio.service.ts
@@ -1,30 +0,0 @@
-import { Injectable } from '@nestjs/common';
-import { PutObjectCommand, S3Client } from '@aws-sdk/client-s3';
-import { ConfigService } from '@nestjs/config';
-
-@Injectable()
-export class MinioService {
-
-  constructor(private configService: ConfigService) {}
-
-  private readonly client = new S3Client({
-    region: 'us-east-1',
-    endpoint: this.configService.get('MINIOHOST'),
-    credentials: {
-      accessKeyId: this.configService.get('MINIOUSER'),
-      secretAccessKey: this.configService.get('MINIOACCESSKEY'),
-    },
-    forcePathStyle: true,
-  });
-
-  async uploadPdf(bucket: string, key: string, pdfBuffer: Buffer): Promise<void> {
-    await this.client.send(
-      new PutObjectCommand({
-        Bucket: bucket,
-        Key: key,
-        Body: pdfBuffer,
-        ContentType: 'application/pdf',
-      }),
-    );
-  }
-}
--- a/api/src/shared/pdf/pdf.module.ts
+++ b/api/src/shared/pdf/pdf.module.ts
@@ -1,12 +0,0 @@
-import { Module } from '@nestjs/common';
-import { KeyHandoverPdfService } from './key-handover-pdf/key-handover-pdf.service';
-import { MinioService } from './minio/minio.service';
-import { ConfigModule } from '@nestjs/config';
-import { DatabaseModule } from '../database/database.module';
-
-@Module({
-  providers: [KeyHandoverPdfService, MinioService],
-  imports: [ConfigModule, DatabaseModule],
-  exports: [KeyHandoverPdfService]
-})
-export class PdfModule {}
--- a/api/src/shared/storage/services/pdf/pdf.service.ts
+++ b/api/src/shared/storage/services/pdf/pdf.service.ts
@@ -0,0 +1,52 @@
+import { HttpService } from '@nestjs/axios';
+import { Injectable } from '@nestjs/common';
+import { ConfigService } from '@nestjs/config';
+import { AxiosResponse } from 'axios';
+import { firstValueFrom } from 'rxjs';
+import { KeyHandoverPDFDataDto } from 'src/model/dto/key-handover.dto';
+import { KeyHandoutRepository } from 'src/model/repositories/key-handout.repository';
+
+@Injectable()
+export class PdfService {
+
+  private readonly STORAGESERVER = this.configService.get('STORAGE_HOST')
+
+  constructor(
+    private readonly configService: ConfigService,
+    private readonly httpService: HttpService,
+    private readonly handoverRepo: KeyHandoutRepository
+  ) {  }
+
+  public async generatePDF(dto: KeyHandoverPDFDataDto): Promise<{ pdf: Buffer, response: AxiosResponse}> {
+    const h = await this.handoverRepo.findOneByOrFail({ id: dto.handoverId });
+    const response = await this.post(`${this.STORAGESERVER}/pdf/keyhandover`, dto);
+    console.log(response)
+    if (response?.data == null) { return; }
+    h.pdfFormKey = response.data;
+    await this.handoverRepo.save(h);
+    return this.getPDFByHandoverKey(response.data)
+    
+  }
+
+  public async getPDFByHandoverKey(key: string): Promise<{ pdf: Buffer, response: AxiosResponse}> {
+    return new Promise(resolve => {
+      this.httpService.get(`${this.STORAGESERVER}/pdf/keyhandover/${key}`, {
+      responseType: 'arraybuffer',
+      }).subscribe({
+        next: pdf => {
+          const pdfBuffer = Buffer.from(pdf.data);
+          resolve({ pdf: pdfBuffer, response: pdf})
+        },
+        error: e => console.log(e)
+      })
+    })
+  }
+
+  private async post(url: string, data: any): Promise<AxiosResponse> {
+    return new Promise(resolve => {
+      this.httpService.post(url, data).subscribe({
+        next: data => resolve(data)
+      })
+    })
+  }
+}
--- a/api/src/shared/storage/storage.module.ts
+++ b/api/src/shared/storage/storage.module.ts
@@ -0,0 +1,13 @@
+import { Module } from '@nestjs/common';
+import { StorageService } from './storage.service';
+import { HttpModule } from '@nestjs/axios';
+import { ConfigModule } from '@nestjs/config';
+import { PdfService } from './services/pdf/pdf.service';
+import { DatabaseModule } from '../database/database.module';
+
+@Module({
+  imports: [HttpModule, ConfigModule, DatabaseModule],
+  providers: [StorageService, PdfService ],
+  exports: [ StorageService, PdfService ]
+})
+export class StorageModule {}
--- a/api/src/shared/storage/storage.service.ts
+++ b/api/src/shared/storage/storage.service.ts
@@ -0,0 +1,11 @@
+import { Injectable } from '@nestjs/common';
+import { ConfigService } from '@nestjs/config';
+
+@Injectable()
+export class StorageService {
+  constructor(private readonly configService: ConfigService) {
+    console.log(configService.get('STORAGE_HOST'))
+  }
+
+  
+}
--- a/client/src/app/modules/keys/components/create-handover-pdf-dialog/create-handover-pdf-dialog.component.ts
+++ b/client/src/app/modules/keys/components/create-handover-pdf-dialog/create-handover-pdf-dialog.component.ts
@@ -37,7 +37,6 @@ export class CreateHandoverPdfDialogComponent {
  });

  ngOnInit() {
-    console.log(this.data)
    this.patchInitialData();
  }

--- a/client/src/app/modules/keys/components/handover-dialog/handover-dialog.component.ts
+++ b/client/src/app/modules/keys/components/handover-dialog/handover-dialog.component.ts
@@ -80,7 +80,18 @@ export class HandoverDialogComponent extends AgGridContainerComponent {
        , sort: 'desc'
        , cellRenderer: (data: any) => this.datePipe.transform(new Date(data.value))
      },
-    
+      {
+        colId: 'download',
+        headerName: 'PDF',
+        field: 'pdfFormKey',
+        width: 60,
+        tooltipValueGetter: () => 'Übergabeprotokoll herunterladen',
+        cellRenderer: () => '',
+        cellClass: (data: any) => data.value ? 'download-pdf' : '',
+        onCellClicked: (event) => {
+          this.downloadHandoverPDF(event.value)
+        },
+      }
    ]
  }

@@ -94,7 +105,7 @@ export class HandoverDialogComponent extends AgGridContainerComponent {
    key: new FormControl(this.data),
    direction: new FormControl('out', Validators.required),
    timestamp: new FormControl(new Date(), Validators.required),
-    handoverDocument: new FormControl<boolean>(false)
+    handoverDocument: new FormControl<boolean>(true)
  });

  ngOnInit() {
@@ -104,7 +115,6 @@ export class HandoverDialogComponent extends AgGridContainerComponent {
  loadData() {
    this.isLoading = true;
    const promises: Observable<any>[] = [
-      this.getHandovers(),
      from(this.loadCustomers())
    ];

@@ -218,6 +228,13 @@ export class HandoverDialogComponent extends AgGridContainerComponent {
  onGridReady(params: GridReadyEvent) {
    this.gridApi = params.api;
    this.gridApi.addEventListener("cellEditingStopped", evt => {})
+    this.getHandovers();
+    //this.downloadHandoverPDF('5b1f92d9-c66c-49ad-b654-b9a9a6a59752')
+  }
+
+  downloadHandoverPDF(key: string) {
+    if (!key) { return; }
+    this.api.getHandoverPdf(key)
  }

 }
--- a/client/src/app/shared/api.service.ts
+++ b/client/src/app/shared/api.service.ts
@@ -482,4 +482,20 @@ export class ApiService {
    })
    
  }
+
+  getHandoverPdf(handoverId: string) {
+    return new Promise(resolve => {
+      this.http.get(`/api/key/${handoverId}/handover/pdf`,{
+        responseType: 'blob',
+      }).subscribe((blob) => {
+        const url = URL.createObjectURL(blob);
+        const a = document.createElement('a');
+        a.href = url;
+        a.download = 'schluesseluebergabe.pdf';
+        a.click();
+        URL.revokeObjectURL(url);
+        resolve(null)
+      });
+    })
+  }
 }
--- a/client/src/assets/img/pdf.png
+++ b/client/src/assets/img/pdf.png
--- a/client/src/styles.scss
+++ b/client/src/styles.scss
@@ -62,6 +62,19 @@ html, body {

 }

+.download-pdf {
+  background-image: url("./assets/img/pdf.png");
+  background-size: 22px;
+  background-repeat: no-repeat;
+  background-position: center;
+  cursor: pointer;
+  transition: background-color 0.2s ease-in-out;
+  // background-color: red;
+  &:hover {
+    background-color: #ccc;
+  }
+}
+
 .icon-btn-xs {
  width: 28px;
  height: 28px;