This commit is contained in:
Bastian Wagner
@@ -131,166 +131,180 @@ export class PdfService {
|
||||
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;
|
||||
}
|
||||
<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;
|
||||
}
|
||||
h1 {
|
||||
text-align: center;
|
||||
margin: 0 0 24px 0;
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.section {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
.section {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
margin-bottom: 8px;
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding-bottom: 4px;
|
||||
}
|
||||
.section-title {
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
margin-bottom: 8px;
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding-bottom: 4px;
|
||||
}
|
||||
|
||||
.row {
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
.row {
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: inline-block;
|
||||
width: 170px;
|
||||
font-weight: bold;
|
||||
vertical-align: top;
|
||||
}
|
||||
.label {
|
||||
display: inline-block;
|
||||
width: 170px;
|
||||
font-weight: bold;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.value {
|
||||
display: inline-block;
|
||||
max-width: 360px;
|
||||
word-break: break-word;
|
||||
}
|
||||
.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;
|
||||
}
|
||||
.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;
|
||||
}
|
||||
.declaration {
|
||||
margin-top: 24px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.signature-wrapper {
|
||||
margin-top: 60px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 40px;
|
||||
}
|
||||
.signature-wrapper {
|
||||
margin-top: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.signature-block {
|
||||
width: 45%;
|
||||
}
|
||||
.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>
|
||||
.signature-line {
|
||||
border-top: 1px solid #000;
|
||||
margin-top: 50px;
|
||||
padding-top: 6px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
<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("de-DE"))}</span>
|
||||
</div>
|
||||
<div class="row" style="display: none">
|
||||
<span class="label">Ort:</span>
|
||||
<span class="value">${this.escapeHtml(dto.place)}</span>
|
||||
</div>
|
||||
</div>
|
||||
.return-section {
|
||||
margin-top: 50px;
|
||||
padding-top: 20px;
|
||||
border-top: 1px dashed #999;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Übergabeprotokoll</h1>
|
||||
|
||||
<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">Übergabedaten</div>
|
||||
<div class="row">
|
||||
<span class="label">Datum der Übergabe:</span>
|
||||
<span class="value">${this.escapeHtml(new Date(dto.handoverDate).toLocaleDateString("de-DE"))}</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">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">Ü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">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 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>
|
||||
<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="declaration">
|
||||
Hiermit bestätigt der Empfänger den Erhalt der oben aufgeführten Schlüssel.
|
||||
</div>
|
||||
|
||||
<div class="signature-wrapper">
|
||||
<div class="signature-block">
|
||||
<div class="signature-line">Unterschrift Empfänger</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="return-section">
|
||||
<div class="section-title">Rückgabe des Schlüssels</div>
|
||||
|
||||
<div class="declaration">
|
||||
Hiermit wird bestätigt, dass der oben aufgeführte Schlüssel zurückgegeben wurde.
|
||||
</div>
|
||||
|
||||
<div class="signature-wrapper">
|
||||
<div class="signature-block">
|
||||
<div class="signature-line">Unterschrift Rücknahme</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<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>
|
||||
`;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user