Add reset button to PDF toolbar for signature reset
Added a reset button to the PDF toolbar in `EnvelopeViewer.razor` to allow users to reset all signatures and state. The button is conditionally displayed when there are signed signatures (`_signedSignatures > 0`). Implemented the `RestartSigning` method to reload the page and reset all signatures by navigating to the current URI with `forceLoad: true`. Introduced new styles in `envelope-viewer.css` for the reset button, including hover effects, background gradients, border colors, and transitions for a polished user experience. Updated the reset button to include an SVG icon with hover effects for better visual feedback and consistency with the application's design.
This commit is contained in:
@@ -256,6 +256,22 @@
|
|||||||
</svg>
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="pdf-toolbar__divider"></div>
|
||||||
|
|
||||||
|
@* Reset button - only show when signatures are signed *@
|
||||||
|
@if (_signedSignatures > 0) {
|
||||||
|
<div class="pdf-toolbar__section">
|
||||||
|
<button class="pdf-toolbar__btn pdf-toolbar__btn--reset"
|
||||||
|
@onclick="RestartSigning"
|
||||||
|
title="Unterschriften zurücksetzen">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" viewBox="0 0 16 16">
|
||||||
|
<path fill-rule="evenodd" d="M8 3a5 5 0 1 0 4.546 2.914.5.5 0 0 1 .908-.417A6 6 0 1 1 8 2v1z"/>
|
||||||
|
<path d="M8 4.466V.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384L8.41 4.658A.25.25 0 0 1 8 4.466z"/>
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
@@ -777,6 +793,11 @@ const int MaxThumbnailWidth = 400;
|
|||||||
await JSRuntime.InvokeVoidAsync("pdfViewer.goToNextSignature", _dotNetRef);
|
await JSRuntime.InvokeVoidAsync("pdfViewer.goToNextSignature", _dotNetRef);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
void RestartSigning() {
|
||||||
|
// Force page reload to reset all signatures and state
|
||||||
|
Navigation.NavigateTo(Navigation.Uri, forceLoad: true);
|
||||||
|
}
|
||||||
|
|
||||||
record SignatureNavState(int Total, int Signed, int Unsigned, int CurrentIndex, bool CanGoPrev, bool CanGoNext);
|
record SignatureNavState(int Total, int Signed, int Unsigned, int CurrentIndex, bool CanGoPrev, bool CanGoNext);
|
||||||
|
|
||||||
// Signature popup methods
|
// Signature popup methods
|
||||||
|
|||||||
@@ -461,6 +461,29 @@ body.resizing {
|
|||||||
color: #059669;
|
color: #059669;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Reset Button Styles */
|
||||||
|
.pdf-toolbar__btn--reset {
|
||||||
|
background: linear-gradient(135deg, rgba(239, 68, 68, 0.08) 0%, rgba(220, 38, 38, 0.08) 100%);
|
||||||
|
border-color: rgba(239, 68, 68, 0.3);
|
||||||
|
color: #dc2626;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pdf-toolbar__btn--reset:hover:not(:disabled) {
|
||||||
|
background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
|
||||||
|
border-color: transparent;
|
||||||
|
color: white;
|
||||||
|
transform: translateY(-1px);
|
||||||
|
box-shadow: 0 4px 12px rgba(239, 68, 68, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.pdf-toolbar__btn--reset svg {
|
||||||
|
transition: color 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pdf-toolbar__btn--reset:hover:not(:disabled) svg {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
.pdf-frame {
|
.pdf-frame {
|
||||||
background: white;
|
background: white;
|
||||||
border-radius: 16px;
|
border-radius: 16px;
|
||||||
|
|||||||
Reference in New Issue
Block a user