Gestita pagina notifiche

2025-09-11 16:06:19 +02:00
parent 7319378e75
commit 7bfe67a97c
30 changed files with 611 additions and 105 deletions
--- a/salesbook.Shared/Components/SingleElements/Card/NotificationCard.razor
+++ b/salesbook.Shared/Components/SingleElements/Card/NotificationCard.razor
@@ -1,15 +1,86 @@
-@using salesbook.Shared.Core.Dto.Notification
+@using salesbook.Shared.Core.Entity

-<div class="row">
-    <div class="behind"><button class="trash-btn"><MudIcon Icon="@Icons.Material.Filled.Delete" /></button></div>
+<div class="row" id="@Notification.Id">
+    <div class="behind-left">
+        <button class="read-btn">
+            <MudIcon Icon="@Icons.Material.Rounded.Check" />
+        </button>
+    </div>
+    <div class="behind-right">
+        <button class="trash-btn">
+            <MudIcon Icon="@Icons.Material.Rounded.Delete" />
+        </button>
+    </div>
    <div class="notification-card">
-        <div>
-            <div class="title">@Notification.Title</div>
-            <div class="subtitle">@Notification.Message</div>
+        @if (Notification.NotificationData is { Type: not null })
+        {
+            @switch (Notification.NotificationData.Type)
+            {
+                case "memo":
+                    <div class="avatar"><MudIcon Icon="@Icons.Material.Rounded.ContentPaste" /></div>
+                    break;
+                case "newPlanned":
+                    <div class="avatar"><MudIcon Icon="@Icons.Material.Rounded.CalendarMonth" /></div>
+                    break;
+            }
+        }
+        <div class="notification-body">
+            <div class="title-row">
+                <div class="title">@Notification.Title</div>
+
+                <div class="section-time">
+                    <div class="notification-time">@GetTimeAgo(Notification.StartDate)</div>
+                    @if (Unread)
+                    {
+                        <span class="unread-dot"></span>
+                    }
+                </div>
+            </div>
+
+            @if (
+                Notification.StartDate < DateTime.Today && Notification.Body != null && Notification.Body.Contains("Oggi")
+            )
+            {
+                <MudText Typo="Typo.caption" Class="subtitle">@Notification.Body.Replace("Oggi", $"{Notification.StartDate:d}")</MudText>
+            }
+            else
+            {
+                <MudText Typo="Typo.caption" Class="subtitle">@Notification.Body</MudText>
+            }
        </div>
    </div>
 </div>

@code {
-    [Parameter] public PushNotificationDTO Notification { get; set; } = new();
+    [Parameter] public bool Unread { get; set; }
+    [Parameter] public WtbNotification Notification { get; set; } = new();
+
+    private static string GetTimeAgo(DateTime? timestamp)
+    {
+        if (timestamp is null) return "";
+
+        var difference = DateTime.Now - timestamp.Value;
+
+        switch (difference.TotalMinutes)
+        {
+            case < 1:
+                return "Adesso";
+            case < 60:
+                return $"{(int)difference.TotalMinutes} minuti fa";
+            default:
+            {
+                switch (difference.TotalHours)
+                {
+                    case < 2:
+                        return $"{(int)difference.TotalHours} ora fa";
+                    case < 24:
+                        return $"{timestamp.Value:t}";
+                    default:
+                    {
+                        return difference.TotalDays < 7 ? $"{(int)difference.TotalDays}g fa" : timestamp.Value.ToString("dd/MM/yyyy");
+                    }
+                }
+            }
+        }
+    }
 }
--- a/salesbook.Shared/Components/SingleElements/Card/NotificationCard.razor.css
+++ b/salesbook.Shared/Components/SingleElements/Card/NotificationCard.razor.css
@@ -6,18 +6,27 @@
    width: 100%;
 }

-.behind {
+.behind-left, .behind-right {
    position: absolute;
    inset: 0;
    display: flex;
-    justify-content: flex-end;
    align-items: center;
-    padding-right: 14px;
-    background: var(--mud-palette-error);
    z-index: 0;
 }

-.trash-btn {
+.behind-right {
+    justify-content: flex-end;
+    padding-right: 14px;
+    background: var(--mud-palette-error);
+}
+
+.behind-left {
+    justify-content: flex-start;
+    padding-left: 14px;
+    background: var(--mud-palette-info);
+}
+
+.read-btn, .trash-btn {
    color: white;
    padding: 10px 15px;
    cursor: pointer;
@@ -29,6 +38,7 @@
    display: flex;
    align-items: center;
    padding: 12px;
+    gap: 12px;
    background: var(--mud-palette-background);
    transition: transform .2s ease;
    touch-action: pan-y;
@@ -37,15 +47,34 @@
 }

 .avatar {
-    width: 42px;
+    min-width: 42px;
    height: 42px;
    border-radius: 12px;
    display: grid;
    place-items: center;
-    background: #0b1220;
-    border: 1px solid #1f2937;
+    background: var(--mud-palette-background);
+    border: 1px solid var(--mud-palette-divider);
    font-weight: bold;
-    color: #22d3ee;
+    color: var(--mud-palette-primary);
+}
+
+.notification-body {
+    width: 100%
+}
+
+.title-row {
+    display: flex;
+    gap: 8px;
+    justify-items: center;
+    align-items: flex-start;
+    justify-content: space-between;
+}
+
+.unread-dot {
+    width: 10px;
+    height: 10px;
+    background-color: var(--mud-palette-error);
+    border-radius: 50%;
 }

 .title {
@@ -53,12 +82,24 @@
    margin-bottom: unset !important;
 }

-.subtitle {
+.section-time {
+    display: flex;
+    align-items: center;
+    gap: .5rem;
+}
+
+.notification-time {
    font-size: 13px;
    color: #94a3b8;
+    line-height: normal;
 }

 .collapsing {
    transition: height .22s ease, margin .22s ease, opacity .22s ease;
    overflow: hidden;
+}
+
+.subtitle {
+    font-size: 12px;
+    color: var(--mud-palette-drawer-text);
 }
--- a/salesbook.Shared/Components/SingleElements/Modal/ActivityForm.razor
+++ b/salesbook.Shared/Components/SingleElements/Modal/ActivityForm.razor
@@ -74,9 +74,18 @@
                <div class="divider"></div>

                <div class="form-container">
-                    <span>Avviso</span>
+                    <span class="disable-full-width">Avviso</span>

-                    <MudSwitch ReadOnly="IsView" T="bool" Disabled="true" Color="Color.Primary"/>
+                    <MudSelectExtended FullWidth="true" ReadOnly="@(IsView || ActivityModel.EstimatedTime == null)" T="int" Variant="Variant.Text" @bind-Value="ActivityModel.MinuteBefore" @bind-Value:after="OnAfterChangeTimeBefore" Class="customIcon-select" AdornmentIcon="@Icons.Material.Filled.Code">
+                        <MudSelectItemExtended Class="custom-item-select" Text="Nessuno" Value="-1">Nessuno</MudSelectItemExtended>
+                        <MudSelectItemExtended Class="custom-item-select" Text="All'ora pianificata" Value="0">All'ora pianificata</MudSelectItemExtended>
+                        <MudSelectItemExtended Class="custom-item-select" Text="15 minuti prima" Value="15">15 minuti prima</MudSelectItemExtended>
+                        <MudSelectItemExtended Class="custom-item-select" Text="30 minuti prima" Value="30">30 minuti prima</MudSelectItemExtended>
+                        <MudSelectItemExtended Class="custom-item-select" Text="1 ora prima" Value="60">1 ora prima</MudSelectItemExtended>
+                        <MudSelectItemExtended Class="custom-item-select" Text="2 ore prima" Value="120">2 ore prima</MudSelectItemExtended>
+                        <MudSelectItemExtended Class="custom-item-select" Text="1 giorno prima" Value="1440">1 giorno prima</MudSelectItemExtended>
+                        <MudSelectItemExtended Class="custom-item-select" Text="1 settimana prima" Value="10080">1 settimana prima</MudSelectItemExtended>
+                    </MudSelectExtended>
                </div>
            </div>

@@ -84,7 +93,7 @@
                <div class="form-container">
                    <span class="disable-full-width">Assegnata a</span>

-                    <MudSelectExtended FullWidth="true" ReadOnly="IsView" T="string?" Variant="Variant.Text" @bind-Value="ActivityModel.UserName" @bind-Value:after="OnAfterChangeValue" Class="customIcon-select" AdornmentIcon="@Icons.Material.Filled.Code">
+                    <MudSelectExtended FullWidth="true" ReadOnly="IsView" T="string?" Variant="Variant.Text" @bind-Value="ActivityModel.UserName" @bind-Value:after="OnUserChanged" Class="customIcon-select" AdornmentIcon="@Icons.Material.Filled.Code">
                        @foreach (var user in Users)
                        {
                            <MudSelectItemExtended Class="custom-item-select" Value="@user.UserName">@user.FullName</MudSelectItemExtended>
@@ -376,17 +385,22 @@
        return false;
    }

-    private async Task LoadData()
+    private Task LoadData()
    {
-        if (!IsNew && Id != null)
+        return Task.Run(async () =>
        {
-            ActivityFileList = await IntegryApiService.GetActivityFile(Id);
-        }
+            if (!IsNew && Id != null)
+            {
+                ActivityFileList = await IntegryApiService.GetActivityFile(Id);
+            }

-        Users = await ManageData.GetTable<StbUser>();
-        ActivityResult = await ManageData.GetTable<StbActivityResult>();
-        Clienti = await ManageData.GetClienti(new WhereCondContact {FlagStato = "A"});
-        Pros = await ManageData.GetProspect();
+            Users = await ManageData.GetTable<StbUser>();
+            ActivityResult = await ManageData.GetTable<StbActivityResult>();
+            Clienti = await ManageData.GetClienti(new WhereCondContact {FlagStato = "A"});
+            Pros = await ManageData.GetProspect();
+
+            await InvokeAsync(StateHasChanged);
+        });
    }

    private async Task LoadActivityType()
@@ -448,6 +462,24 @@
        OnAfterChangeValue();
    }

+    private void OnAfterChangeTimeBefore()
+    {
+        if (ActivityModel.EstimatedTime != null)
+        {
+            if (ActivityModel.MinuteBefore != -1)
+            {
+                ActivityModel.NotificationDate = ActivityModel.MinuteBefore == 0 ? 
+                    ActivityModel.EstimatedTime : ActivityModel.EstimatedTime.Value.AddMinutes(ActivityModel.MinuteBefore * -1);
+            }
+            else
+            {
+                ActivityModel.NotificationDate = null;
+            }
+        }
+
+        OnAfterChangeValue();
+    }
+
    private void OnAfterChangeValue()
    {
        if (!IsNew)