TekH
469e335fc3
Added a `BackColor` property to both `signature` and `signatureLabel` objects to improve visual consistency. Adjusted the `BoundsF` property of `signatureLabel` to slightly move the label upward for better alignment.
729 lines
35 KiB
Plaintext
729 lines
35 KiB
Plaintext
@page "/receiver/{EnvelopeKey}"
|
||
@using System.Drawing
|
||
@using DevExpress.Blazor
|
||
@using DevExpress.Drawing
|
||
@using DevExpress.Utils
|
||
@using DevExpress.XtraPrinting
|
||
@using DevExpress.XtraPrinting.Drawing
|
||
@using Microsoft.JSInterop
|
||
@using XtraReport = DevExpress.XtraReports.UI.XtraReport
|
||
@using BottomMarginBand = DevExpress.XtraReports.UI.BottomMarginBand
|
||
@using XRLabel = DevExpress.XtraReports.UI.XRLabel
|
||
@using XRPictureBox = DevExpress.XtraReports.UI.XRPictureBox
|
||
@using XRControl = DevExpress.XtraReports.UI.XRControl
|
||
@using ImageSizeMode = DevExpress.XtraPrinting.ImageSizeMode
|
||
@using EnvelopeGenerator.ReceiverUI.Services
|
||
@using DevExpress.Blazor.Reporting
|
||
@using Microsoft.Extensions.Options
|
||
@using EnvelopeGenerator.ReceiverUI.Options
|
||
@using EnvelopeGenerator.ReceiverUI.Models
|
||
@implements IDisposable
|
||
@inject IJSRuntime JSRuntime
|
||
@inject AnnotationService AnnotationService
|
||
@inject IOptions<ApiOptions> AppOptions
|
||
@inject NavigationManager Navigation
|
||
@inject InMemoryReportStorageWebExtension ReportStorage
|
||
@inject EnvelopeGenerator.ReceiverUI.Services.DocumentService DocumentService
|
||
@inject EnvelopeGenerator.ReceiverUI.Services.AuthService AuthService
|
||
@inject EnvelopeGenerator.ReceiverUI.Services.EnvelopeReceiverService EnvelopeReceiverService
|
||
|
||
<link href="_content/DevExpress.Blazor.Themes/blazing-berry.bs5.min.css" rel="stylesheet" />
|
||
<link href="_content/DevExpress.Blazor.Reporting.Viewer/css/dx-blazor-reporting-components.bs5.css" rel="stylesheet" />
|
||
|
||
<div class="receiver-page-layout">
|
||
|
||
<div class="receiver-signature-panel">
|
||
|
||
@* ?? Envelope info header ???????????????????????????????????????????????? *@
|
||
@if (_envelopeReceiver is not null) {
|
||
<div class="receiver-info-header">
|
||
<div class="receiver-info-header__gradient">
|
||
<div class="receiver-info-header__left">
|
||
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" fill="currentColor" class="receiver-info-header__icon" viewBox="0 0 16 16">
|
||
<path d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4Zm2-1a1 1 0 0 0-1 1v.217l7 4.2 7-4.2V4a1 1 0 0 0-1-1H2Zm13 2.383-4.708 2.825L15 11.105V5.383Zm-.034 6.876-5.64-3.471L8 9.583l-1.326-.795-5.64 3.47A1 1 0 0 0 2 13h12a1 1 0 0 0 .966-.741ZM1 11.105l4.708-2.897L1 5.383v5.722Z"/>
|
||
</svg>
|
||
<div>
|
||
<div class="receiver-info-header__title">@(_envelopeReceiver.Envelope?.Title ?? "Dokument")</div>
|
||
@if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.User?.FullName) || !string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.User?.Email)) {
|
||
<div class="receiver-info-header__sender">
|
||
Von
|
||
@if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.User?.FullName)) {
|
||
<strong>@_envelopeReceiver.Envelope!.User!.FullName</strong>
|
||
}
|
||
@if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.User?.Email)) {
|
||
<span class="opacity-75"><@_envelopeReceiver.Envelope!.User!.Email></span>
|
||
}
|
||
· @_envelopeReceiver.Envelope?.AddedWhen.ToString("dd.MM.yyyy")
|
||
</div>
|
||
}
|
||
</div>
|
||
</div>
|
||
<div class="receiver-info-header__badges">
|
||
@if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Name)) {
|
||
<span class="receiver-info-badge">
|
||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="me-1" viewBox="0 0 16 16">
|
||
<path d="M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Z"/>
|
||
</svg>
|
||
@_envelopeReceiver.Name
|
||
</span>
|
||
}
|
||
@if (!string.IsNullOrWhiteSpace(_envelopeReceiver.CompanyName)) {
|
||
<span class="receiver-info-badge">
|
||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="me-1" viewBox="0 0 16 16">
|
||
<path d="M14.763.075A.5.5 0 0 1 15 .5v15a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5V14h-1v1.5a.5.5 0 0 1-.5.5h-9a.5.5 0 0 1-.5-.5V10a.5.5 0 0 1 .342-.474L6 7.64V4.5a.5.5 0 0 1 .276-.447l8-4a.5.5 0 0 1 .487.022Z"/>
|
||
</svg>
|
||
@_envelopeReceiver.CompanyName
|
||
</span>
|
||
}
|
||
@if (!string.IsNullOrWhiteSpace(_envelopeReceiver.JobTitle)) {
|
||
<span class="receiver-info-badge receiver-info-badge--muted">@_envelopeReceiver.JobTitle</span>
|
||
}
|
||
@{
|
||
var docElements = _envelopeReceiver.Envelope?.Documents?.FirstOrDefault()?.Elements;
|
||
int sigCount = docElements?.Count() ?? _annotations.Count;
|
||
}
|
||
@if (sigCount > 0) {
|
||
<span class="receiver-info-badge receiver-info-badge--accent">
|
||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="me-1" viewBox="0 0 16 16">
|
||
<path d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z"/>
|
||
</svg>
|
||
@sigCount @(sigCount == 1 ? "Unterschriftsfeld" : "Unterschriftsfelder")
|
||
</span>
|
||
}
|
||
</div>
|
||
</div>
|
||
@if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.Message)) {
|
||
<div class="receiver-info-message">@_envelopeReceiver.Envelope!.Message</div>
|
||
}
|
||
@if (!string.IsNullOrWhiteSpace(_envelopeReceiver.PrivateMessage)) {
|
||
<div class="receiver-info-private-message">
|
||
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" fill="currentColor" class="me-1 flex-shrink-0" viewBox="0 0 16 16">
|
||
<path d="M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2z"/>
|
||
</svg>
|
||
@_envelopeReceiver.PrivateMessage
|
||
</div>
|
||
}
|
||
</div>
|
||
}
|
||
|
||
@* ?? Signature action bar ???????????????????????????????????????????????? *@
|
||
<div class="receiver-action-bar">
|
||
<div class="receiver-action-bar__inner">
|
||
<button class="btn btn-sm @(_capturedSignature is not null ? "btn-outline-success" : "btn-primary")" @onclick="OpenSignaturePopupAsync">
|
||
@if (_capturedSignature is not null) {
|
||
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" fill="currentColor" class="me-1" viewBox="0 0 16 16">
|
||
<path d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z"/>
|
||
</svg>
|
||
<span>Unterschrift gespeichert</span>
|
||
} else {
|
||
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" fill="currentColor" class="me-1" viewBox="0 0 16 16">
|
||
<path d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z"/>
|
||
</svg>
|
||
<span>Unterschrift erstellen</span>
|
||
}
|
||
</button>
|
||
|
||
@if (_annotations.Count > 0 && !SignatureApplied) {
|
||
<div class="receiver-action-bar__progress">
|
||
<div class="progress" style="height:5px; min-width:70px; width:90px;">
|
||
<div class="progress-bar @(_checkedAnnotations.Count == _annotations.Count ? "bg-success" : "bg-primary")"
|
||
style="width:@(_annotations.Count > 0 ? (_checkedAnnotations.Count * 100 / _annotations.Count) : 0)%"
|
||
role="progressbar"></div>
|
||
</div>
|
||
<span class="text-muted" style="font-size:0.75rem;">
|
||
@_checkedAnnotations.Count / @_annotations.Count
|
||
Seite@(AnnotationPages.Count() == 1 ? "" : "n") @string.Join(",", AnnotationPages)
|
||
</span>
|
||
@if (_capturedSignature is null) {
|
||
<span class="text-muted fst-italic" style="font-size:0.72rem;">Zuerst Unterschrift erstellen</span>
|
||
} else if (_checkedAnnotations.Count == _annotations.Count) {
|
||
<span class="text-success fw-semibold" style="font-size:0.72rem;">✓ Wird angewendet…</span>
|
||
}
|
||
</div>
|
||
}
|
||
|
||
@if (!string.IsNullOrWhiteSpace(SignatureValidationMessage)) {
|
||
<span class="text-danger" style="font-size:0.78rem;">@SignatureValidationMessage</span>
|
||
}
|
||
@if (SignatureApplied) {
|
||
<span class="text-success" style="font-size:0.78rem;">
|
||
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" fill="currentColor" class="me-1" viewBox="0 0 16 16">
|
||
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
|
||
</svg>
|
||
Unterschrift angewendet
|
||
</span>
|
||
}
|
||
|
||
<div class="ms-auto d-flex align-items-center gap-2">
|
||
<button class="btn btn-sm btn-success" disabled="@(!SignatureApplied)" @onclick="ExportSignedPdfAsync">
|
||
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" fill="currentColor" class="me-1" viewBox="0 0 16 16">
|
||
<path d="M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5z"/>
|
||
<path d="M7.646 11.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 10.293V1.5a.5.5 0 0 0-1 0v8.793L5.354 8.146a.5.5 0 1 0-.708.708l3 3z"/>
|
||
</svg>
|
||
PDF exportieren
|
||
</button>
|
||
@if (!string.IsNullOrWhiteSpace(EnvelopeKey)) {
|
||
<button class="btn btn-sm btn-outline-danger" @onclick="LogoutAsync" disabled="@IsLoggingOut" title="Abmelden">
|
||
@if (IsLoggingOut) {
|
||
<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||
} else {
|
||
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" viewBox="0 0 16 16">
|
||
<path fill-rule="evenodd" d="M10 12.5a.5.5 0 0 1-.5.5h-8a.5.5 0 0 1-.5-.5v-9a.5.5 0 0 1 .5-.5h8a.5.5 0 0 1 .5.5v2a.5.5 0 0 0 1 0v-2A1.5 1.5 0 0 0 9.5 2h-8A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h8a1.5 1.5 0 0 0 1.5-1.5v-2a.5.5 0 0 0-1 0v2z"/>
|
||
<path fill-rule="evenodd" d="M15.854 8.354a.5.5 0 0 0 0-.708l-3-3a.5.5 0 0 0-.708.708L14.293 7.5H5.5a.5.5 0 0 0 0 1h8.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3z"/>
|
||
</svg>
|
||
}
|
||
</button>
|
||
}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<DxPopup @bind-Visible="SignaturePopupVisible"
|
||
HeaderText="Unterschrift erfassen"
|
||
Width="620px"
|
||
ShowFooter="true"
|
||
CloseOnEscape="false"
|
||
ShowCloseButton="false"
|
||
CloseOnOutsideClick="false"
|
||
Shown="OnPopupShownAsync">
|
||
<BodyContentTemplate>
|
||
<ul class="nav nav-tabs mb-3">
|
||
<li class="nav-item">
|
||
<button type="button" class="nav-link @(ActiveSignatureTab == SignatureTabDraw ? "active" : null)" @onclick="() => SetSignatureTabAsync(SignatureTabDraw)">Zeichnen</button>
|
||
</li>
|
||
<li class="nav-item">
|
||
<button type="button" class="nav-link @(ActiveSignatureTab == SignatureTabText ? "active" : null)" @onclick="() => SetSignatureTabAsync(SignatureTabText)">Text</button>
|
||
</li>
|
||
<li class="nav-item">
|
||
<button type="button" class="nav-link @(ActiveSignatureTab == SignatureTabImage ? "active" : null)" @onclick="() => SetSignatureTabAsync(SignatureTabImage)">Bild</button>
|
||
</li>
|
||
</ul>
|
||
|
||
@if(ActiveSignatureTab == SignatureTabDraw) {
|
||
<p class="text-muted mb-2">Bitte unterschreiben Sie im folgenden Feld.</p>
|
||
<canvas id="receiver-signature-pad" width="520" height="160" class="border rounded bg-white w-100" style="max-width: 520px; touch-action: none;"></canvas>
|
||
} else if(ActiveSignatureTab == SignatureTabText) {
|
||
<p class="text-muted mb-2">Geben Sie Ihre Unterschrift als Text ein und waehlen Sie eine Schriftart.</p>
|
||
<div class="row g-2 mb-2">
|
||
<div class="col-12 col-md-7">
|
||
<input class="form-control" placeholder="Ihre Unterschrift" value="@TypedSignatureText" @oninput="OnTypedSignatureChanged" />
|
||
</div>
|
||
<div class="col-12 col-md-5">
|
||
<select class="form-select" value="@TypedSignatureFont" @onchange="OnTypedSignatureFontChanged">
|
||
@foreach(var font in TypedSignatureFonts) {
|
||
<option value="@font.Value" style="font-family: @font.Value">@font.Text</option>
|
||
}
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<canvas id="receiver-typed-signature-pad" width="520" height="160" class="border rounded bg-white w-100" style="max-width: 520px;"></canvas>
|
||
} else {
|
||
<p class="text-muted mb-2">Laden Sie ein Bild Ihrer Unterschrift hoch.</p>
|
||
<input id="receiver-signature-image-input" class="form-control mb-2" type="file" accept="image/png,image/jpeg,image/webp" />
|
||
<canvas id="receiver-image-signature-pad" width="520" height="160" class="border rounded bg-white w-100" style="max-width: 520px;"></canvas>
|
||
}
|
||
|
||
|
||
<div class="border-top mt-3 pt-3">
|
||
<p class="text-muted mb-2">Bitte geben Sie die folgenden Angaben ein. Das Datum wird automatisch hinzugefuegt.</p>
|
||
<div class="row g-2">
|
||
<div class="col-12 col-md-6">
|
||
<label class="form-label" for="receiver-signer-name">Vor- und Nachname *</label>
|
||
<input id="receiver-signer-name" class="form-control" value="@SignerFullName" @oninput="args => SignerFullName = args.Value?.ToString() ?? string.Empty" />
|
||
</div>
|
||
<div class="col-12 col-md-6">
|
||
<label class="form-label" for="receiver-signer-position">Position</label>
|
||
<input id="receiver-signer-position" class="form-control" value="@SignerPosition" @oninput="args => SignerPosition = args.Value?.ToString() ?? string.Empty" />
|
||
</div>
|
||
<div class="col-12 col-md-6">
|
||
<label class="form-label" for="receiver-signature-place">Ort *</label>
|
||
<input id="receiver-signature-place" class="form-control" value="@SignaturePlace" @oninput="args => SignaturePlace = args.Value?.ToString() ?? string.Empty" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
@if(!string.IsNullOrWhiteSpace(PopupValidationMessage)) {
|
||
<div class="text-danger mt-2">@PopupValidationMessage</div>
|
||
}
|
||
</BodyContentTemplate>
|
||
<FooterContentTemplate>
|
||
<div class="d-flex gap-2 flex-wrap justify-content-end w-100">
|
||
<button class="btn btn-outline-secondary" @onclick="RenewSignatureAsync">Unterschrift erneuern</button>
|
||
<button class="btn btn-primary" @onclick="SaveSignatureAsync">Speichern</button>
|
||
</div>
|
||
</FooterContentTemplate>
|
||
</DxPopup>
|
||
|
||
<div class="receiver-viewer-wrapper">
|
||
@if(Report is not null) {
|
||
<DxReportViewer @key="ViewerKey" @ref="reportViewer" Report="Report" RootCssClasses="w-100 h-100" Zoom="1.3" />
|
||
}
|
||
</div>
|
||
|
||
</div>
|
||
|
||
@code {
|
||
|
||
const string SignatureTabDraw = "draw";
|
||
const string SignatureTabText = "text";
|
||
const string SignatureTabImage = "image";
|
||
const string DrawCanvasId = "receiver-signature-pad";
|
||
const string TypedCanvasId = "receiver-typed-signature-pad";
|
||
const string ImageInputId = "receiver-signature-image-input";
|
||
const string ImageCanvasId = "receiver-image-signature-pad";
|
||
|
||
readonly (string Text, string Value)[] TypedSignatureFonts = {
|
||
("Brush Script", "'Brush Script MT', cursive"),
|
||
("Segoe Script", "'Segoe Script', cursive"),
|
||
("Lucida Handwriting", "'Lucida Handwriting', cursive"),
|
||
("Comic Sans", "'Comic Sans MS', cursive"),
|
||
("Cursive", "cursive")
|
||
};
|
||
|
||
[Parameter] public string EnvelopeKey { get; set; } = string.Empty;
|
||
|
||
DxReportViewer? reportViewer;
|
||
XtraReport? Report;
|
||
bool SignatureApplied;
|
||
bool SignaturePopupVisible;
|
||
string? SignatureValidationMessage;
|
||
string? PopupValidationMessage;
|
||
string ActiveSignatureTab = SignatureTabDraw;
|
||
string TypedSignatureText = string.Empty;
|
||
string TypedSignatureFont = "'Brush Script MT', cursive";
|
||
string SignerFullName = string.Empty;
|
||
string SignerPosition = string.Empty;
|
||
string SignaturePlace = string.Empty;
|
||
int ViewerKey;
|
||
bool IsLoggingOut;
|
||
|
||
IReadOnlyList<AnnotationDto> _annotations = [];
|
||
IEnumerable<int> AnnotationPages => _annotations.Select(a => a.Page).Distinct().OrderBy(p => p);
|
||
EnvelopeReceiverDto? _envelopeReceiver;
|
||
record SignatureCapture(string DataUrl, string FullName, string Position, string Place);
|
||
SignatureCapture? _capturedSignature;
|
||
byte[]? _basePdfBytes;
|
||
// annotation IDs the user has checked via overlay checkboxes
|
||
readonly HashSet<long> _checkedAnnotations = [];
|
||
DotNetObjectReference<ReportViewer>? _dotNetRef;
|
||
int _lastOverlayViewerKey = -1;
|
||
|
||
async Task LogoutAsync() {
|
||
if (string.IsNullOrWhiteSpace(EnvelopeKey) || IsLoggingOut) return;
|
||
IsLoggingOut = true;
|
||
await InvokeAsync(StateHasChanged);
|
||
await AuthService.LogoutEnvelopeReceiverAsync(EnvelopeKey);
|
||
Navigation.NavigateTo($"/login/{Uri.EscapeDataString(EnvelopeKey)}", forceLoad: true);
|
||
}
|
||
|
||
protected override async Task OnInitializedAsync() {
|
||
|
||
if (!string.IsNullOrWhiteSpace(EnvelopeKey)) {
|
||
var hasAccess = await AuthService.CheckEnvelopeAccessAsync(EnvelopeKey);
|
||
if (!hasAccess) {
|
||
Navigation.NavigateTo($"/login/{Uri.EscapeDataString(EnvelopeKey)}");
|
||
return;
|
||
}
|
||
else
|
||
{
|
||
ActiveSignatureTab = SignatureTabDraw;
|
||
SignaturePopupVisible = true;
|
||
SignatureValidationMessage = null;
|
||
PopupValidationMessage = null;
|
||
}
|
||
}
|
||
|
||
_annotations = await AnnotationService.GetAnnotationsAsync(EnvelopeKey ?? "fake");
|
||
_envelopeReceiver = await EnvelopeReceiverService.GetAsync(EnvelopeKey ?? "fake");
|
||
|
||
if (!AppOptions.Value.ForceToUseFakeDocument && !string.IsNullOrWhiteSpace(EnvelopeKey)) {
|
||
var (pdfBytes, _) = await DocumentService.GetDocumentAsync(EnvelopeKey);
|
||
if (pdfBytes is { Length: > 0 })
|
||
_basePdfBytes = pdfBytes;
|
||
}
|
||
|
||
var initialReport = BuildFreshBaseReport();
|
||
Report = initialReport;
|
||
}
|
||
|
||
protected override async Task OnAfterRenderAsync(bool firstRender) {
|
||
if (firstRender)
|
||
_dotNetRef = DotNetObjectReference.Create(this);
|
||
|
||
|
||
if (Report is not null && _annotations.Count > 0
|
||
&& _capturedSignature is not null && !SignatureApplied
|
||
&& _lastOverlayViewerKey != ViewerKey) {
|
||
_lastOverlayViewerKey = ViewerKey;
|
||
await JSRuntime.InvokeVoidAsync(
|
||
"receiverSignature.installAnnotationCheckboxes",
|
||
_annotations, _checkedAnnotations.ToArray(), _dotNetRef);
|
||
}
|
||
}
|
||
|
||
[JSInvokable]
|
||
public async Task OnAnnotationToggled(long annotationId, bool isChecked) {
|
||
if (isChecked)
|
||
_checkedAnnotations.Add(annotationId);
|
||
else
|
||
_checkedAnnotations.Remove(annotationId);
|
||
await InvokeAsync(StateHasChanged);
|
||
|
||
if (_capturedSignature is not null
|
||
&& !SignatureApplied
|
||
&& _annotations.Count > 0
|
||
&& _checkedAnnotations.Count == _annotations.Count) {
|
||
// K?sa bekleme: kullan?c? son tick'in g<>rsel feedback'ini g<>rs<72>n
|
||
await Task.Delay(400);
|
||
await SubmitSignaturesAsync();
|
||
}
|
||
}
|
||
|
||
void OpenSignaturePopupAsync() {
|
||
ActiveSignatureTab = SignatureTabDraw;
|
||
SignaturePopupVisible = true;
|
||
SignatureValidationMessage = null;
|
||
PopupValidationMessage = null;
|
||
}
|
||
|
||
async Task OnPopupShownAsync() {
|
||
await InitializeActiveSignatureTabAsync();
|
||
}
|
||
|
||
async Task SetSignatureTabAsync(string tab) {
|
||
ActiveSignatureTab = tab;
|
||
PopupValidationMessage = null;
|
||
await InvokeAsync(StateHasChanged);
|
||
await Task.Delay(50);
|
||
await InitializeActiveSignatureTabAsync();
|
||
}
|
||
|
||
async Task InitializeActiveSignatureTabAsync() {
|
||
if(ActiveSignatureTab == SignatureTabDraw) {
|
||
await JSRuntime.InvokeVoidAsync("receiverSignature.initialize", DrawCanvasId);
|
||
} else if(ActiveSignatureTab == SignatureTabText) {
|
||
await JSRuntime.InvokeVoidAsync("receiverSignature.initializeTyped", TypedCanvasId);
|
||
await RenderTypedSignatureAsync();
|
||
} else {
|
||
await JSRuntime.InvokeVoidAsync("receiverSignature.initializeImage", ImageInputId, ImageCanvasId);
|
||
}
|
||
}
|
||
|
||
async Task RenewSignatureAsync() {
|
||
PopupValidationMessage = null;
|
||
|
||
if(ActiveSignatureTab == SignatureTabDraw) {
|
||
await JSRuntime.InvokeVoidAsync("receiverSignature.clear", DrawCanvasId);
|
||
} else if(ActiveSignatureTab == SignatureTabText) {
|
||
TypedSignatureText = string.Empty;
|
||
await JSRuntime.InvokeVoidAsync("receiverSignature.clearTyped", TypedCanvasId);
|
||
} else {
|
||
await JSRuntime.InvokeVoidAsync("receiverSignature.clearImage", ImageInputId, ImageCanvasId);
|
||
}
|
||
}
|
||
|
||
void CloseSignaturePopup() {
|
||
PopupValidationMessage = null;
|
||
SignaturePopupVisible = false;
|
||
}
|
||
|
||
async Task OnTypedSignatureChanged(Microsoft.AspNetCore.Components.ChangeEventArgs args) {
|
||
TypedSignatureText = args.Value?.ToString() ?? string.Empty;
|
||
await RenderTypedSignatureAsync();
|
||
}
|
||
|
||
async Task OnTypedSignatureFontChanged(Microsoft.AspNetCore.Components.ChangeEventArgs args) {
|
||
TypedSignatureFont = args.Value?.ToString() ?? TypedSignatureFont;
|
||
await RenderTypedSignatureAsync();
|
||
}
|
||
|
||
async Task RenderTypedSignatureAsync() {
|
||
await JSRuntime.InvokeVoidAsync("receiverSignature.renderTypedSignature", TypedCanvasId, TypedSignatureText, TypedSignatureFont);
|
||
}
|
||
|
||
async Task SaveSignatureAsync() {
|
||
if (string.IsNullOrWhiteSpace(SignerFullName)) {
|
||
PopupValidationMessage = "Bitte geben Sie Vor- und Nachname ein.";
|
||
return;
|
||
}
|
||
if (string.IsNullOrWhiteSpace(SignaturePlace)) {
|
||
PopupValidationMessage = "Bitte geben Sie den Ort ein.";
|
||
return;
|
||
}
|
||
var signatureDataUrl = await GetActiveSignatureDataUrlAsync();
|
||
if (string.IsNullOrWhiteSpace(signatureDataUrl)) {
|
||
PopupValidationMessage = "Die Unterschrift ist fuer den PDF-Export erforderlich.";
|
||
return;
|
||
}
|
||
|
||
PopupValidationMessage = null;
|
||
SignatureValidationMessage = null;
|
||
_capturedSignature = new(signatureDataUrl, SignerFullName.Trim(), SignerPosition.Trim(), SignaturePlace.Trim());
|
||
|
||
// If no annotations, apply immediately (no checkbox step needed)
|
||
if (_annotations.Count == 0) {
|
||
var freshReport = BuildFreshBaseReport();
|
||
AddSignature(freshReport, _capturedSignature.DataUrl, _capturedSignature.FullName, _capturedSignature.Position, _capturedSignature.Place);
|
||
Report = freshReport;
|
||
SignatureApplied = true;
|
||
SignaturePopupVisible = false;
|
||
ViewerKey++;
|
||
return;
|
||
}
|
||
|
||
// Close popup; checkboxes will appear on the PDF via OnAfterRenderAsync
|
||
SignaturePopupVisible = false;
|
||
_lastOverlayViewerKey = -1; // force overlay reinstall
|
||
await InvokeAsync(StateHasChanged);
|
||
}
|
||
|
||
async Task SubmitSignaturesAsync() {
|
||
if (_checkedAnnotations.Count == 0) {
|
||
SignatureValidationMessage = "Bitte markieren Sie mindestens ein Unterschriftsfeld im Dokument.";
|
||
return;
|
||
}
|
||
if (_checkedAnnotations.Count < _annotations.Count) {
|
||
SignatureValidationMessage = $"Bitte markieren Sie alle {_annotations.Count} Unterschriftsfelder. Noch {_annotations.Count - _checkedAnnotations.Count} offen.";
|
||
return;
|
||
}
|
||
|
||
SignatureValidationMessage = null;
|
||
var freshReport = BuildFreshBaseReport();
|
||
foreach (var ann in _annotations)
|
||
AddSignatureAtAnnotation(freshReport, ann, _capturedSignature!.DataUrl, _capturedSignature.FullName, _capturedSignature.Position, _capturedSignature.Place);
|
||
|
||
Report = freshReport;
|
||
SignatureApplied = true;
|
||
ViewerKey++;
|
||
await InvokeAsync(StateHasChanged);
|
||
}
|
||
|
||
async Task<string?> GetActiveSignatureDataUrlAsync() {
|
||
if(ActiveSignatureTab == SignatureTabDraw)
|
||
return await JSRuntime.InvokeAsync<string?>("receiverSignature.getDataUrl", DrawCanvasId);
|
||
|
||
if(ActiveSignatureTab == SignatureTabText) {
|
||
await RenderTypedSignatureAsync();
|
||
return await JSRuntime.InvokeAsync<string?>("receiverSignature.getTypedDataUrl", TypedCanvasId);
|
||
}
|
||
|
||
return await JSRuntime.InvokeAsync<string?>("receiverSignature.getImageDataUrl", ImageCanvasId);
|
||
}
|
||
|
||
async Task ExportSignedPdfAsync() {
|
||
if(!SignatureApplied || Report is null) {
|
||
SignatureValidationMessage = "Bitte fuegen Sie die Unterschrift zuerst zum Bericht hinzu.";
|
||
return;
|
||
}
|
||
|
||
try {
|
||
SignatureValidationMessage = null;
|
||
await reportViewer!.ExportToAsync(ExportFormat.Pdf);
|
||
} catch(Exception) {
|
||
SignatureValidationMessage = "Das signierte PDF konnte nicht exportiert werden. Bitte laden Sie die Seite neu und versuchen Sie es erneut.";
|
||
}
|
||
}
|
||
|
||
XtraReport BuildFreshBaseReport() {
|
||
if (_basePdfBytes is { Length: > 0 }) {
|
||
var report = new XtraReport();
|
||
var detail = new DevExpress.XtraReports.UI.DetailBand();
|
||
report.Bands.Add(detail);
|
||
detail.Controls.Add(new DevExpress.XtraReports.UI.XRPdfContent { Source = _basePdfBytes, GenerateOwnPages = true });
|
||
return report;
|
||
}
|
||
return CreateReportInstance();
|
||
}
|
||
|
||
static void AddAnnotationPlaceholders(XtraReport report, IReadOnlyList<AnnotationDto> annotations) {
|
||
var bottomMargin = report.Bands.OfType<BottomMarginBand>().FirstOrDefault();
|
||
if (bottomMargin is null) {
|
||
bottomMargin = new BottomMarginBand();
|
||
report.Bands.Add(bottomMargin);
|
||
}
|
||
|
||
const float sigWidth = 230F;
|
||
const float sigHeight = 154F;
|
||
const float bottomPad = 6F;
|
||
const float defaultTopPad = 8F;
|
||
const float maxBandHeight = 210F;
|
||
|
||
float requiredHeight = defaultTopPad + sigHeight + bottomPad;
|
||
bottomMargin.HeightF = Math.Min(maxBandHeight, Math.Max(bottomMargin.HeightF, requiredHeight));
|
||
float topPad = Math.Max(0F, bottomMargin.HeightF - bottomPad - sigHeight);
|
||
|
||
foreach (var ann in annotations) {
|
||
float sigX = (float)(ann.X);
|
||
var annotId = ann.Id.ToString();
|
||
|
||
var placeholder = new XRLabel {
|
||
Name = $"receiverSignaturePlaceholder_{annotId}",
|
||
Text = "\u270e Bitte unterschreiben",
|
||
BoundsF = new RectangleF(sigX, topPad, sigWidth, sigHeight),
|
||
Borders = BorderSide.All,
|
||
BorderColor = System.Drawing.Color.FromArgb(230, 81, 0),
|
||
BackColor = System.Drawing.Color.FromArgb(30, 255, 236, 153),
|
||
Font = new DXFont("Open Sans", 10F, DXFontStyle.Regular),
|
||
ForeColor = System.Drawing.Color.FromArgb(94, 38, 0),
|
||
TextAlignment = TextAlignment.MiddleCenter
|
||
};
|
||
|
||
bottomMargin.Controls.Add(placeholder);
|
||
}
|
||
}
|
||
|
||
XtraReport CreateReportInstance() {
|
||
return ReportStorage.TryGetReport("LargeDatasetReport", out var savedReport)
|
||
? savedReport
|
||
: PredefinedReports.ReportsFactory.GetReport("LargeDatasetReport");
|
||
}
|
||
|
||
static void AddSignature(XtraReport report, string signatureDataUrl, string signerFullName, string signerPosition, string signaturePlace) {
|
||
var imageBytes = Convert.FromBase64String(signatureDataUrl[(signatureDataUrl.IndexOf(',') + 1)..]);
|
||
using var imageStream = new MemoryStream(imageBytes);
|
||
var imageSource = new ImageSource(DXImage.FromStream(imageStream));
|
||
var bottomMargin = report.Bands.OfType<BottomMarginBand>().FirstOrDefault();
|
||
|
||
if(bottomMargin is null) {
|
||
bottomMargin = new BottomMarginBand();
|
||
report.Bands.Add(bottomMargin);
|
||
}
|
||
|
||
RemoveExistingSignature(bottomMargin);
|
||
|
||
// Layout constants
|
||
const float sigX = 390F;
|
||
const float sigWidth = 230F;
|
||
const float sigImgHeight = 70F;
|
||
const float infoHeight = 65F; // up to 4 lines at 8pt
|
||
const float innerGap = 5F;
|
||
const float bottomPad = 6F;
|
||
const float defaultTopPad = 8F;
|
||
const float maxBandHeight = 210F;
|
||
|
||
float requiredHeight = defaultTopPad + sigImgHeight + innerGap + infoHeight + bottomPad;
|
||
|
||
// Grow band if needed, but cap at maxBandHeight to avoid overlapping page content
|
||
bottomMargin.HeightF = Math.Min(maxBandHeight, Math.Max(bottomMargin.HeightF, requiredHeight));
|
||
|
||
// If band is tighter than required, compress top padding so content still fits
|
||
float topPad = Math.Max(0F, bottomMargin.HeightF - bottomPad - infoHeight - innerGap - sigImgHeight);
|
||
|
||
float imageY = topPad;
|
||
float labelY = imageY + sigImgHeight + innerGap;
|
||
|
||
var signatureInformation = string.IsNullOrWhiteSpace(signerPosition)
|
||
? $"{signerFullName}\n{signaturePlace}, {DateTime.Now:d}"
|
||
: $"{signerFullName}\n{signerPosition}\n{signaturePlace}, {DateTime.Now:d}";
|
||
|
||
var signature = new XRPictureBox {
|
||
Name = "receiverSignatureImage",
|
||
ImageSource = imageSource,
|
||
BoundsF = new RectangleF(sigX, imageY, sigWidth, sigImgHeight),
|
||
Sizing = ImageSizeMode.ZoomImage,
|
||
Borders = BorderSide.Bottom,
|
||
BorderColor = System.Drawing.Color.FromArgb(73, 80, 87)
|
||
};
|
||
|
||
var signatureLabel = new XRLabel {
|
||
Name = "receiverSignatureLabel",
|
||
Text = signatureInformation,
|
||
Multiline = true,
|
||
BoundsF = new RectangleF(sigX, labelY, sigWidth, infoHeight),
|
||
Font = new DXFont("Open Sans", 8F, DXFontStyle.Regular),
|
||
ForeColor = System.Drawing.Color.FromArgb(73, 80, 87),
|
||
TextAlignment = TextAlignment.TopLeft
|
||
};
|
||
|
||
bottomMargin.Controls.AddRange(new XRControl[] { signature, signatureLabel });
|
||
}
|
||
|
||
static void RemoveExistingSignature(BottomMarginBand bottomMargin) {
|
||
var controls = bottomMargin.Controls
|
||
.Cast<XRControl>()
|
||
.Where(control => control.Name is "receiverSignatureLabel" or "receiverSignatureImage")
|
||
.ToArray();
|
||
|
||
foreach(var control in controls)
|
||
bottomMargin.Controls.Remove(control);
|
||
}
|
||
|
||
static void AddSignatureAtAnnotation(XtraReport report, AnnotationDto? annotation, string signatureDataUrl, string signerFullName, string signerPosition, string signaturePlace) {
|
||
var imageBytes = Convert.FromBase64String(signatureDataUrl[(signatureDataUrl.IndexOf(',') + 1)..]);
|
||
using var imageStream = new MemoryStream(imageBytes);
|
||
var imageSource = new ImageSource(DXImage.FromStream(imageStream));
|
||
|
||
var detail = report.Bands.OfType<DevExpress.XtraReports.UI.DetailBand>().FirstOrDefault();
|
||
if (detail is null) return;
|
||
|
||
var annotId = annotation?.Id.ToString() ?? "0";
|
||
RemoveExistingSignatureById(detail, annotId);
|
||
|
||
const float sigWidth = 230F;
|
||
const float sigImgHeight = 70F;
|
||
const float infoHeight = 48.75F;
|
||
const float innerGap = 5F;
|
||
|
||
float sigX = (float)(annotation?.X ?? 390.0);
|
||
float imageY = (float)(annotation?.Y ?? 900.0);
|
||
float labelY = imageY + sigImgHeight + innerGap;
|
||
int targetPage = annotation?.Page ?? 1;
|
||
|
||
var signatureInformation = string.IsNullOrWhiteSpace(signerPosition)
|
||
? $"{signerFullName}\n{signaturePlace}, {DateTime.Now:d}"
|
||
: $"{signerFullName}\n{signerPosition}\n{signaturePlace}, {DateTime.Now:d}";
|
||
|
||
var signature = new XRPictureBox {
|
||
Name = $"receiverSignatureImage_{annotId}",
|
||
ImageSource = imageSource,
|
||
BoundsF = new RectangleF(sigX, imageY, sigWidth, sigImgHeight),
|
||
Sizing = ImageSizeMode.ZoomImage,
|
||
Borders = BorderSide.Bottom,
|
||
BorderColor = System.Drawing.Color.FromArgb(73, 80, 87),
|
||
BackColor = Color.FromArgb(219, 219, 219)
|
||
};
|
||
|
||
var signatureLabel = new XRLabel {
|
||
Name = $"receiverSignatureLabel_{annotId}",
|
||
Text = signatureInformation,
|
||
Multiline = true,
|
||
BoundsF = new RectangleF(sigX, labelY - 5, sigWidth, infoHeight),
|
||
Font = new DXFont("Open Sans", 8F, DXFontStyle.Regular),
|
||
ForeColor = System.Drawing.Color.FromArgb(73, 80, 87),
|
||
TextAlignment = TextAlignment.TopCenter,
|
||
BackColor = Color.FromArgb(219, 219, 219)
|
||
};
|
||
|
||
// Show each control only on the target page using an independent print counter
|
||
int sigPrintCount = 0;
|
||
signature.BeforePrint += (_, e) => {
|
||
sigPrintCount++;
|
||
e.Cancel = sigPrintCount != targetPage;
|
||
};
|
||
|
||
int lblPrintCount = 0;
|
||
signatureLabel.BeforePrint += (_, e) => {
|
||
lblPrintCount++;
|
||
e.Cancel = lblPrintCount != targetPage;
|
||
};
|
||
|
||
detail.Controls.AddRange(new XRControl[] { signature, signatureLabel });
|
||
}
|
||
|
||
static void RemoveExistingSignatureById(DevExpress.XtraReports.UI.DetailBand detail, string annotId) {
|
||
var controls = detail.Controls
|
||
.Cast<XRControl>()
|
||
.Where(c => c.Name == $"receiverSignatureImage_{annotId}" || c.Name == $"receiverSignatureLabel_{annotId}")
|
||
.ToArray();
|
||
foreach (var c in controls)
|
||
detail.Controls.Remove(c);
|
||
}
|
||
|
||
public void Dispose() {
|
||
_dotNetRef?.Dispose();
|
||
}
|
||
}
|
||
|