Compare commits

...

3 Commits

Author SHA1 Message Date
a.beging@eas-solutions.de
48ad7dda87 Enhance ProspectSortControl: add styling to TextEdit component for improved visibility
Some checks failed
Build And Push Dev Docker Image / docker (push) Failing after 3h0m4s
2026-04-24 15:14:45 +02:00
a.beging@eas-solutions.de
d09926a8b4 Enhance VerificationSettingsDialog: add success message for link copy action and improve button styling 2026-04-24 14:29:18 +02:00
a.beging@eas-solutions.de
954d57b7a6 Refactor UploadVerification page: improve layout, loading indicators, and user instructions for better clarity and usability 2026-04-24 13:45:03 +02:00
4 changed files with 108 additions and 84 deletions

View File

@@ -20,7 +20,7 @@
</Button> </Button>
<div style="flex-grow: 1;" class="mt-3"> <div style="flex-grow: 1;" class="mt-3">
<TextEdit Text="@Filter.Text" TextChanged="TextChangedAsync" Placeholder="Suchen..." Debounce="true" DebounceInterval="200" /> <TextEdit Text="@Filter.Text" TextChanged="TextChangedAsync" Placeholder="Suchen..." Debounce="true" DebounceInterval="200" Style="border: 1px solid #64ae24; background: #fff;" Class="pl-2" />
</div> </div>
<div class="badge-row mt-1 mb-3"> <div class="badge-row mt-1 mb-3">

View File

@@ -10,8 +10,12 @@
<div class="border p-3 rounded"> <div class="border p-3 rounded">
<p class="mb-2 text-muted">Kopiere diesen Link und teile ihn mit <strong>@Prospect?.Name</strong>:</p> <p class="mb-2 text-muted">Kopiere diesen Link und teile ihn mit <strong>@Prospect?.Name</strong>:</p>
<div> <div>
<input type="text" class="form-control" value="@LinkUrl" readonly /><br /> <input type="text" class="form-control" value="@LinkUrl" readonly />
<Button Color="Color.Secondary" Clicked="CopyLink" Style="width: 100%;"> @if(CopySuccess)
{
<div class="alert alert-success py-2 mt-2 mb-0">Link wurde in die Zwischenablage kopiert!</div>
}
<Button Color="Color.Secondary" Clicked="CopyLink" Style="width: 100%;" Class="mt-2">
<i class="fa-solid fa-copy mr-2"></i>Link kopieren <i class="fa-solid fa-copy mr-2"></i>Link kopieren
</Button> </Button>
</div> </div>

View File

@@ -23,6 +23,8 @@ namespace FoodsharingSiegen.Server.Dialogs
private int ImageCount { get; set; } = 0; private int ImageCount { get; set; } = 0;
private bool ShowLinkPanel { get; set; } = false; private bool ShowLinkPanel { get; set; } = false;
private bool CopySuccess { get; set; } = false;
private string LinkUrl { get; set; } = string.Empty; private string LinkUrl { get; set; } = string.Empty;
protected override async Task OnInitializedAsync() protected override async Task OnInitializedAsync()
@@ -77,6 +79,7 @@ namespace FoodsharingSiegen.Server.Dialogs
private async Task CopyLink() private async Task CopyLink()
{ {
await JS.InvokeVoidAsync("navigator.clipboard.writeText", LinkUrl); await JS.InvokeVoidAsync("navigator.clipboard.writeText", LinkUrl);
CopySuccess = true;
} }
private async Task ViewImagesAsync() private async Task ViewImagesAsync()

View File

@@ -11,96 +11,113 @@
<div class="card-body p-3 p-md-5"> <div class="card-body p-3 p-md-5">
<div class="text-center mb-4"> <div class="text-center mb-4">
<h5 class="mb-0 text-success d-block d-sm-none"><i class="fa-solid fa-address-card me-2"></i><br>Identitätsprüfung</h5> <h5 class="mb-0 text-success d-block d-sm-none"><i
<h4 class="mb-0 text-success d-none d-sm-block"><i class="fa-solid fa-address-card me-2"></i>Identitätsprüfung</h4> class="fa-solid fa-address-card me-2"></i><br>Identitätsprüfung</h5>
<h4 class="mb-0 text-success d-none d-sm-block"><i
class="fa-solid fa-address-card me-2"></i>Identitätsprüfung</h4>
<p class="text-muted mt-2">@(AppSettings.Value.Terms.Title)</p> <p class="text-muted mt-2">@(AppSettings.Value.Terms.Title)</p>
</div>
@if (_isLoading)
{
<div class="text-center my-5">
<div class="spinner-border text-success" role="status">
<span class="visually-hidden">Laden...</span>
</div> </div>
<p class="mt-3 text-muted">Lade Daten...</p>
</div>
}
else if (_prospect == null)
{
<div class="alert alert-danger" role="alert">
<i class="fa-solid fa-triangle-exclamation me-2"></i> @(_message ?? "Der Link ist ungültig oder abgelaufen. Bitte fordere einen neuen Link an.")
</div>
}
else
{
<div class="alert alert-info mb-4">
<strong>Hinweis:</strong> Dies ist die Upload-Seite für Foodsaver <b>@_prospect.FsId</b>.
</div>
<div class="mb-3 text-center"> @if (_isLoading)
@if (_uploadedCount >= 5)
{ {
<div class="alert alert-warning py-2 mb-0">Du hast die maximale Anzahl von 5 Bildern erreicht.</div> <div class="text-center my-5">
<div class="spinner-border text-success" role="status">
<span class="visually-hidden">Laden...</span>
</div>
<p class="mt-3 text-muted">Lade Daten...</p>
</div>
}
else if (_prospect == null)
{
<div class="alert alert-danger" role="alert">
<i class="fa-solid fa-triangle-exclamation me-2"></i> @(_message ?? "Der Link ist ungültig oder abgelaufen. Bitte fordere einen neuen Link an.")
</div>
} }
else else
{ {
<InputFile id="fileInput" OnChange="OnInputFileChange" class="d-none" accept="image/*" /> <div class="alert alert-info mb-4">
<label for="fileInput" class="btn btn-outline-success w-100" style="height: 5rem;"> <strong>Hinweis:</strong> Dies ist die Upload-Seite für Foodsaver <b>@_prospect.FsId</b>.
<i class="fa-solid fa-images me-2"></i>Bild auswählen
</label>
<span class="badge bg-secondary mt-2 text-wrap">Es können noch bis zu @(5 - _uploadedCount) Bilder hochgeladen werden</span>
}
</div>
<div class="mb-1 text-muted">
Um dich auf der Foodsharing-Plattform als Foodsaver freischalten zu können, muss ein*e Botschafter*in Name, Adresse und Geburtsdatum im Profil des Foodsavers auf Korrektheit durch Vergleich mit einem Ausweisdokument prüfen. Das ist wichtig, damit die <a href="https://wiki.foodsharing.network/wiki/Rechtsvereinbarung" target="_blank">Rechtsvereinbarung</a> Bestand hat und wir die Zusagen erfüllen, die wir den Spenderbetrieben geben.<br>
</div>
<div class="mb-3 text-muted">
<a class="mt-3" href="https://wiki.foodsharing.network/wiki/Foodsaver#3.4_Verifizierung_(der_Daten),_Foodsaver-Ausweis_und_Freischaltung" target="_blank">Mehr dazu im Wiki</a>.
</div>
<div class="mb-4">
<h5 class="fw-bold">Anleitung:</h5>
<ul class="text-muted">
<li>Lade hier die Vorder- und Rückseite deines Personalausweises oder Reisepasses hoch</li>
<li>Dein Name und Adresse müssen gut und lesbar erkennbar sein</li>
<li>Wir nutzen diese Bilder ausschließlich zur Identitätsprüfung</li>
<li>Ausschließlich die Botschafter haben Zugriff auf diese Bilder</li>
<li>Die Bilder werden nach der Überprüfung sofort und unwiderruflich von uns gelöscht</li>
<li>Bereits hochgeladene Bilder werden hier hier aus Datenschutzgründen nicht angezeigt</li>
</ul>
</div>
@if (_isUploading)
{
<div class="text-center my-3">
<div class="spinner-border text-primary spinner-border-sm" role="status">
<span class="visually-hidden">Laden...</span>
</div> </div>
<span class="ms-2">Bilder werden hochgeladen und verarbeitet...</span>
</div>
}
@if (!string.IsNullOrEmpty(_message)) <div class="mb-3 text-center">
{
<div class="alert alert-@(_isSuccess ? "success" : "danger") alert-dismissible fade show" role="alert"> @if (_uploadedCount >= 5)
@_message {
<button type="button" class="btn-close" @onclick="() => _message = null"></button> <div class="alert alert-warning py-2 mb-0">Du hast die maximale Anzahl von 5 Bildern erreicht.</div>
</div> }
} else
{
<InputFile id="fileInput" OnChange="OnInputFileChange" class="d-none" accept="image/*" />
<label for="fileInput" class="btn btn-outline-success w-100" style="height: 5rem;">
<i class="fa-solid fa-images me-2"></i>Bild auswählen
</label>
}
</div>
@if (!string.IsNullOrEmpty(_message))
{
<div class="alert alert-@(_isSuccess ? "success" : "danger") alert-dismissible fade show" role="alert">
@_message
<button type="button" class="btn-close" @onclick="() => _message = null"></button>
</div>
}
@if (_isSuccess) @if (_isSuccess)
{ {
<div class="alert alert-success text-center"> <div class="alert alert-success text-center">
<i class="fa-solid fa-check-circle fa-2x mb-2"></i><br/> <i class="fa-solid fa-check-circle fa-2x mb-2"></i><br />
Vielen Dank für den Upload. Wenn du alle benötigten Bilder hochgeladen hast, kannst du die Seite schließen. Du musst nichts weiter tun. Vielen Dank für den Upload. Wenn du alle benötigten Bilder hochgeladen hast, kannst du die Seite
schließen. Du musst nichts weiter tun.
</div>
}
@if (_uploadedCount < 5)
{
<div class="text-center mb-3">
<span class="badge bg-secondary text-wrap">Es können noch bis zu @(5 - _uploadedCount) Bilder
hochgeladen werden</span>
</div>
}
<div class="mb-1 text-muted">
Um dich auf der Foodsharing-Plattform als Foodsaver freischalten zu können, muss ein*e
Botschafter*in Name, Adresse und Geburtsdatum im Profil des Foodsavers auf Korrektheit durch
Vergleich mit einem Ausweisdokument prüfen. Das ist wichtig, damit die <a
href="https://wiki.foodsharing.network/wiki/Rechtsvereinbarung"
target="_blank">Rechtsvereinbarung</a> Bestand hat und wir die Zusagen erfüllen, die wir den
Spenderbetrieben geben.<br>
</div>
<div class="mb-3 text-muted">
<a class="mt-3"
href="https://wiki.foodsharing.network/wiki/Foodsaver#3.4_Verifizierung_(der_Daten),_Foodsaver-Ausweis_und_Freischaltung"
target="_blank">Mehr dazu im Wiki</a>.
</div>
<div class="mb-4">
<h5 class="fw-bold">Anleitung:</h5>
<ul class="text-muted">
<li>Lade hier die Vorder- und Rückseite deines Personalausweises oder Reisepasses hoch</li>
<li>Dein Name und Adresse müssen gut und lesbar erkennbar sein</li>
<li>Wir nutzen diese Bilder ausschließlich zur Identitätsprüfung</li>
<li>Ausschließlich die Botschafter haben Zugriff auf diese Bilder</li>
<li>Die Bilder werden nach der Überprüfung sofort und unwiderruflich von uns gelöscht</li>
<li>Bereits hochgeladene Bilder werden hier hier aus Datenschutzgründen nicht angezeigt</li>
</ul>
</div>
@if (_isUploading)
{
<div class="text-center my-3">
<div class="spinner-border text-primary spinner-border-sm" role="status">
<span class="visually-hidden">Laden...</span>
</div>
<span class="ms-2">Bilder werden hochgeladen und verarbeitet...</span>
</div>
}
}
</div> </div>
} </div>
} </div>
</div> </div>
</div>
</div>
</div>