troogs/fs-onboarding
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

Enhance InteractionRow and ProspectContainer: refactor layout to use grid, improve styling, and add interaction handling
All checks were successful
Build And Push Dev Docker Image / docker (push) Successful in 1m30s
Details

Browse Source
This commit is contained in:
troogs
2026-04-21 22:24:58 +02:00
parent 7660e8ce81
commit 4330b53824
4 changed files with 79 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

91
FoodsharingSiegen.Server/Controls/InteractionRow.razor
View File

@@ -5,52 +5,63 @@
@inherits FsBase
@{
var colorClass = "";
if(Done) colorClass = "interaction--color-done";
var rowClass = "";
if (Done) rowClass += " done";
if (NotNeeded) rowClass += " notneeded";
if (Alert) rowClass += " fs-alert";
}
<tr class="@rowClass" style="border-top: 5px solid transparent;">
<th class="text-center align-top pr-2">
<i class="@IconClass"></i>
</th>
<th class="pr-2 align-top" style="white-space: nowrap;">@Type.Translate(AppSettings):</th>
<td class="align-top d-flex flex-column">
@if (Interactions.Count > 0)
{
foreach (var interaction in Interactions)
@if(!AllowInteraction || Prospect is {Complete: true })
{
<Button Size="Size.Small" Disabled="true">
<i class="@ButtonIconClass"></i>
</Button>
}
else
{
@if(Interactions.Count == 0 || Multiple)
{
if (Multiple) ButtonIconClass = "fa-solid fa-plus";
<Button Size="Size.Small" Clicked="@(async () => { if (AddClick != null) await AddClick(Type); })"><i class="@ButtonIconClass" style="color: #64ae24;"></i></Button>
} else {
<Button Size="Size.Small" Clicked="@(async () => { await RemoveFirstAsync(Type); })"><i class="fa-solid fa-times" style="color: rgb(153, 0, 0);"></i></Button>
}
}
<div style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis">
<div class="@colorClass" style="display: inline-block;"><i class="@IconClass"></i> @Type.Translate(AppSettings)</div>
@if(Interactions.Count > 0)
{
<span title="@Interactions.First().User.Memo"> (@Interactions.First().User.Name</span> <span>@Interactions.First().Date.ToShortDateString())</span>
}
</div>
@if(Multiple && Interactions.Count > 0)
{
@foreach (var interaction in Interactions)
{
<div class="d-flex justify-content-end">
@if ((Prospect is not { Complete: true } || interaction.Type == InteractionType.Complete) && AllowInteraction)
{
<div style="padding-bottom: .5rem;">
<div style="white-space: nowrap;">
<span title="@interaction.User.Memo">@interaction.User.Name</span> (@interaction.Date.ToShortDateString())
@if ((Prospect is not { Complete: true } || interaction.Type == InteractionType.Complete) && AllowInteraction)
{
<span>&nbsp;<a href=""><i class="fa-solid fa-square-xmark" @onclick="async () => { if (RemoveClick != null) await RemoveClick.Invoke(interaction.Id); }" @onclick:preventDefault></i></a></span>
}
</div>
<div>
@FeedbackBuilder(interaction)
</div>
<div>
@if (!string.IsNullOrWhiteSpace(interaction.FeedbackInfo))
{
<span>(<i>@interaction.FeedbackInfo</i>)</span>
}
</div>
</div>
<a style="display: inline-block;"" href=""><i class="fa-solid fa-square-xmark" @onclick="async () => { if (RemoveClick != null) await RemoveClick.Invoke(interaction.Id); }" @onclick:preventDefault></i></a>
} else {
<span>&bull;</span>
}
}
@if (Prospect is not {Complete: true } && (Interactions.Count == 0 || Multiple) && AllowInteraction)
{
if (Multiple) ButtonIconClass = "fa-solid fa-plus";
<div class="m-auto">
<Button Size="Size.Small" Clicked="@(async () => { if (AddClick != null) await AddClick(Type); })"><i class="@ButtonIconClass" style="color: #64ae24;"></i></Button>
</div>
<div>
<div>
<span title="@interaction.User.Memo">@interaction.User.Name (@interaction.Date.ToShortDateString())</span>
@if (!string.IsNullOrWhiteSpace(interaction.FeedbackInfo))
{
<span>(<i>@interaction.FeedbackInfo</i>)</span>
}
</div>
}
</td>
</tr>
@FeedbackBuilder(interaction)
</div>
}
}